<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>百度地图</title>
<script type="text/javascript">
var iscreatr=false;
function initialize() {
//---------------------------------------------基础示例---------------------------------------------
var map = new BMap.Map("allmap",{minZoom:12,maxZoom:20}); // 创建Map实例
//map.centerAndZoom(new BMap.Point(116.4035,39.915),15); //初始化时，即可设置中心点和地图缩放级别。
map.centerAndZoom("成都",13); // 初始化地图,设置中心点坐标和地图级别。
map.enableScrollWheelZoom(true);//鼠标滑动轮子可以滚动
map.addEventListener("click", function(e){
if(iscreatr==true)return;
//---------------------------------------------遮盖物---------------------------------------------
iscreatr=true;
var point = new BMap.Point(e.point.lng ,e.point.lat);//默认
// 创建标注对象并添加到地图
var marker = new BMap.Marker(point);
var label = new BMap.Label("我是可以拖动的",{offset:new BMap.Size(20,-10)});
marker.setLabel(label)
map.addOverlay(marker);
marker.enableDragging(); //可拖拽
marker.addEventListener("dragend", function(e){
document.getElementById("r-result").innerHTML = e.point.lng + ", " + e.point.lat;//打印拖动结束坐标
});
});
}
function loadScript() {
var script = document.createElement("script");
script.src = "http://api.map.baidu.com/api?v=1.4&callback=initialize";
document.body.appendChild(script);
}
window.onload = loadScript;
</script>
</head>
<body>
<div id="r-result" style="float:left;width:100px;">打印坐标</div>
<div id="allmap" style="width: 800px; height: 500px"></div>
</body>
</html>
<script type="text/javascript">
// 移动到某点 map.panTo(new BMap.Point(116.409, 39.918));
// map.setZoom(14); //放到到14级
</script>
分享到：
相关推荐
步骤一： ... 下载【X86】版，安装时出现已经有同类型在运行，打开软件管家发现已经有2017版的，卸载...将api-ms-win-downlevel-shlwapi-l1-1-0.dll拷贝到C:\Windows\System32和C:\Windows\SysWOW64. 'import cv2' 成功
bootstrap-table实现 行拖拽 插件 jquery.tablednd.js bootstrap-table-reorder-rows.js bootstrap-table-reorder-rows.css
这个文件的核心在于“定制”和“最小化”，这两个特点使得它在实际项目中更具灵活性和效率。 1. **定制性**： 在jQuery UI中，开发者可以根据项目的具体需求选择所需的组件，避免引入不必要的代码，提高页面加载...
ant-design-vue(可拖拽table).vue
为了提升用户体验，开发者还可以利用百度地图API的交互功能，比如点击轨迹点弹出详细信息框，或者拖动时间滑块来查看不同时间段的轨迹。这需要熟悉JavaScript和HTML5，以及CSS来实现页面布局和交互效果。 此外，...
**百度地图API教程 实例** 在当今信息化社会，地图服务已经成为各类应用不可或缺的一部分。百度地图API作为国内广泛应用的地图服务提供商，为开发者提供了丰富的接口和工具，使得开发者能够轻松地将地图功能集成到...
ArcGIS Runtime SDK for Android 100.4.0是开发Android GIS应用的首选工具，它将复杂的GIS功能封装成易于使用的API，降低了开发门槛，同时提供了强大的地理计算能力，让开发者能够构建出富有创新和实用性的地图应用...
在本案例中，"js百度地图api坐标地址标注功能"是指利用百度地图API来实现在地图上进行坐标定位并标注地址的功能。这个功能允许用户在地图上看到特定坐标点，并且这些标注可以具有交互性，如拖拽、改变大小、最小化、...
综上所述，通过百度地图API和jQuery，我们可以高效地在地图上展示多个标注点，并且与这些标注点关联丰富的信息。无论是简单的地理位置展示，还是复杂的交互式地图应用，都能借助这些技术轻松实现。在实际项目中，...
在本文中，我们将深入探讨如何使用百度地图JavaScript API 来绘制轨迹，并添加自定义图标和标注。这是一项在Web开发中常用于地理位置展示和分析的重要技术。首先，我们需要理解百度地图API的基础概念及其核心功能。 ...
本压缩包"**C#百度地图API.rar**"提供了一套关于C#与百度地图API结合使用的参考资料，对于那些需要在自己的应用中集成地图功能的开发者来说非常有价值。下面将详细解释其中涉及的关键知识点： 1. **C#编程语言**: ...
微信小程序百度地图API v1.0是专门为微信小程序开发者设计的一款地图服务库，它整合了百度地图的功能，使开发者能够方便地在微信小程序中集成地图显示、定位、路线规划等地图相关功能。这个API版本包括两个核心文件...
该压缩包文件“Android高级应用源码-高德地图Marker拖动圆环范围.rar”包含了一个Android应用示例，这个示例重点展示了如何在高德地图API中实现Marker的拖动以及显示一个可拖动的圆环范围。下面将详细阐述相关知识点...
该压缩包文件“Android高级应用源码-高德地图Marker拖动圆环范围.zip”包含了一个基于Android平台的高德地图API的高级示例。这个示例主要展示了如何实现地图上的Marker（标记）以及拖动圆环范围的功能，这对于开发...
**开发指南--百度地图JavaScript API大众版** **一、JavaScript API概述** 百度地图JavaScript API是一套基于JavaScript语言的开发工具，旨在帮助开发者在自己的网站上创建功能丰富的地图应用。该API提供了基本的...
百度地图API就是这样的一个工具，它让开发者能够轻松集成百度地图服务，实现地图展示、标注、路线查询等功能。 在描述中提到的"百度地图小例子"，通常是指利用百度地图API开发的简单应用，可能是显示特定位置的地图...
4. 变量与常量：显示类的字段、方法和常量池信息，方便追踪变量和常量的使用。 三、Windows环境下安装与使用 1. 下载与解压：首先从官方网站或者其他可信源下载jd-gui-windows-1.2.0.zip，解压缩后得到JD-GUI的执行...
该资源是谷歌浏览器插件安装文件，下载后拖拽到chrome‘扩展程序’即可完成插件离线安装。
- 事件处理：处理用户的交互事件，如点击、拖动等。 - 网络编程：提供HTTP、FTP等协议的客户端和服务器功能。 - 数据存储：通过SQL模块连接数据库，进行数据读写。 **6. Qt 3.3.4版本的特点** 虽然3.3.4是较旧的...
这个压缩包“安卓开发-高德地图Marker拖动圆环范围.zip.zip”内包含的资源很可能是关于如何在高德地图上实现Marker拖动及与其关联的圆环范围动态调整的示例代码或教程。 首先，我们需要了解在高德地图API中，Marker...