jsp，juery,js,javaScript,web前端引用腾讯地图根据经纬度动态标记并圈出范围，标记点击显示详情

最新推荐文章于 2023-02-18 11:21:00 发布
最新推荐文章于 2023-02-18 11:21:00 发布
阅读量1.8k 收藏 1
点赞数
文章标签： 腾讯地图 jsp javascrpict 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Chen_XiRan/article/details/90897070
版权

先上图看效果-----------根据经纬度动态加载地图标记，根据经纬度位置动态加载半径圈出范围，点击标记显示当前标记信息

代码图：

首先引用加载腾讯地图官网示例地址：

https://lbs.qq.com/javascript_v2/demo.html

https://lbs.qq.com/javascript_v2/case-run.html#sample-overlay-marker2

需要什么功能可以参考官方API示例

 

---------------------------------------下面本人自己使用的代码-------------------------

<%@ page language="java" pageEncoding="UTF-8" contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/pages/common/taglibs.jsp" %>
<c:set var="rootTitleName" value="前置仓"/>
<!DOCTYPE html>
<html>
<head>
    <%@ include file="/WEB-INF/pages/common/mainCss.jsp" %>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>简单地图</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
	<style type="text/css">
		*{
			margin:0px;
			padding:0px;
		}
		body, button, input, select, textarea {
			font: 12px/16px Verdana, Helvetica, Arial, sans-serif;
		}
		#container{
			min-width:600px;
			min-height:800px;
		}
	</style>
</head>
 
<body onload="init()">
<div class="main game-list">
<div class="main-top">
<h3>所有${rootTit
最低0.47元/天 解锁文章
Chen_XiRan
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
微信小程序-腾讯地图根据经纬度获取位置与根据位置获取经纬度
qq_45689385的博客
04-14 3484
注意：如果request非法，请移步 到 上一篇博客填写request合法域名章节，上一篇博客末尾也有写道获取当前定位得方法 一、根据经纬度获取位置信息 登陆腾讯地图官网，选择控制台，选择开发文档-->微信小程序JavaScript SDK 创建应用 接下来就是用代码得到实现了 //根据经纬度获取城市信息 getCity(){ wx.request({ url: 'https://apis.map.qq.com/w...
腾讯地图选择店铺位置和用户下单位置范围
weixin_47164415的博客
04-09 531
{include file="public/admin_header" /} <div class="layui-fluid"> <div class="layui-row layui-col-space15"> <div class="layui-col-md12"> <form class="layui-form" action="" lay-filter="component-form-element" onsubmit="return
使用OpenLayers根据经纬度对地图进行多个标点，以及点击标点弹框的实现（从后台数据库获取经纬度数据）
爱吃鸡腿的明仔
04-16 5663
说明：根据前面的知识，我们已经简单实现了离线地图以及根据经纬度单点标注地图且弹框的功能。具体实现操作请参照我的另外两篇博文：使用OpenLayers发布离线地图和使用OpenLayers根据经纬度对地图进行单个标点，以及点击标点弹框的实现（没有从后台获取经纬度数据） 1.拿到实际项目应用来说，根据经纬度来进行地图标点，一般情况下都是从后台数据库来拿到数据，前端离线地图再来进行显示标注并弹框，那我们...
js引用腾讯地图案例
weixin_48161877的博客
01-18 1363
1、效果展示： 2、代码走一波： 地址解析 search 您点击的位置（经度：，纬度：，解析出来的地址：）
腾讯地图实现多点标注
cleverlzc的专栏
08-07 2万+
function init() { var center = new qq.maps.LatLng(39.916527,116.397128); var map = new qq.maps.Map(document.getElementById("container"), { center: center, zoom: 13 });
JSP.rar_JavaScript/JQuery_JavaScript_
08-12
JavaScript和jQuery主要用于前端，提供动态效果和用户输入验证，而JSP则在后端处理业务逻辑和数据库操作。 【标签】"JavaScript/JQuery JavaScript" 表明这个项目重点在于JavaScript和jQuery的使用。JavaScript是一...
javascript实现点击提交按钮后显示loading的方法
10-23
主要介绍了javascript实现点击提交按钮后显示loading的方法,涉及javascript动态设置页面元素样式的相关技巧,需要的朋友可以参考下
jsp页面显示百度地图api并获取经纬度
08-09
是个人在公司里边做项目的时候，百度+个人思考摸索出来的，有什么错误，请原谅
Java项目:超市管理系统(java+SSM+JSP+Javascript+JQUERY+H-ui+mysql)
最新发布
03-18
项目介绍 本项目主要分为管理员和库管员两种角色；...前端：JSP+CSS+Javascript+JQUERY+H-ui 使用说明 1. 使用Navicat或者其它工具，在mysql中创建对应sql文件名称的数据库，并导入项目的sql文件
腾讯地图行政区划边界绘制教程来啦！！
腾讯位置服务
03-12 2473
前言 腾讯地图iOS SDK推出了4.4.0版本，更新了多个比较实用的功能，本次介绍地图SDK行政区划检索功能新添加的行政区划轮廓点串，可以让我们在地图上绘制行政区划的边界。 使用场景 绘制行政区划的边界 准备 腾讯地图iOS SDK 单个行政区划绘制 1、使用QMSDistrictSearchSearchOption类来发起单个行政区划检索功能 QMSDistrictSearchSearchOption *option = [[QMSDistrictSearchSearchOption alloc]
腾讯地图画出区域获取该区域的范围坐标
热门推荐
直到世界的尽头
11-27 2万+
腾讯地图画出区域获取该区域的范围坐标
由地图经纬度获得地图瓦片编号
love_data_scientist的博客
11-16 1万+
参考文章  http://blog.csdn.net/youngkingyj/article/details/23365849
JS_js腾讯地图通过详细地址获取经纬度
小歪博客
02-26 1204
<script charset="utf-8" src="http://map.qq.com/api/js?v=2.exp&key=腾讯地图key"></script> <script> var geocoder, map, marker = null; geocoder = new qq.maps.Geocoder(); function codeAddress() { var address = '中国,北京,海淀区,
电商项目：配送站划分，根据坐标，判断该坐标是否在地图区域范围内
有一个小阿飞
10-25 1736
最近在写配送区域相关的代码，具体需求如下： 根据腾讯地图划分配送区域，总站下边设多个配送分站，然后将订单中的收货地址将其分配给不同的配送分站。 1、地图区域划分（腾讯地图）     1.1、HTML 1.2、JS //初始化新地图 initNewMap:function(){ var map = new qq.maps.Map(document.getElem...
web使用百度地图实现经纬度定位和轨迹
u012954380的博客
04-17 1万+
1首先成为百度开发者(注意选择浏览器端和JavascriptAPI)2.申请秘钥(如果不想对访问网址进行限制的话   Referer白名单使用 * )3.定位的代码&lt;%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%&gt; &lt;% String name = ...
腾讯地图画圆
小屁孩大帅-保密的博客
05-06 2396
1：坐标取拾地址https://lbs.qq.com/getPoint/ 2：在线代码运行地址https://lbs.qq.com/webDemoCenter/javascriptV2/polygon/circleRadius 3：图例 4：代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />.
腾讯地图根据leaflet经纬度解析出详细地址信息
weixin_44081503的博客
12-01 779
map.onclick(e => { //Prj是leaflet经纬度转换成腾讯使用的经纬度 const gcjLocation = Prj.wgsToGcj( e.latlng.lat, e.latlng.lng ); this.handleLatLngToAddress(gcjLocation, res => { this.locationAddress = res.detail; this.Cmap.addMarker(e.latlng); this.locationInfo = ${e.
地图坐标系大全：常用地图坐标系详解与转换指南
weixin_39888010的博客
02-18 1万+
地图坐标系是用于描述地图上位置的数学模型。它可以用来表示地球表面上的任意一个点，使得这个点的位置可以在地图上精确定位。不同的地图坐标系采用不同的基准面和投影方式，因此会有不同的坐标系参数，不同的坐标系之间也需要进行坐标转换。在地图制图、导航、GIS等领域中，地图坐标系是一个非常重要的概念。
腾讯地图多边形转换成圆
qq_39966730的博客
12-05 842
//根据圆心获取对应区域的经纬度数组 getRadius(latLng,list) {//times 半径，单位：公里；latLng为点击地图时的经纬度，即为圆心，list传进来的参数默认是空数组 var latRate = 0.008983153559494;//此参数为本人经过测试后所得的维度为1公里的固定参数值 var lngRate = 0.0096998403403;//此参数为本人经过测试后所得的经度为1公里的固定参数值 var times = 0.15;//默认设置为150米,具体值可
使用JSP技术开发动态web实例.doc
11-28
使用JSP技术开发动态web实例.doc

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值