百度地图Api进阶教程-点击生成和拖动标注4.html
<!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>
百度地图Api进阶教程-点击生成和拖动标注4.html的更多相关文章
- 百度地图Api进阶教程-实例高级操作8.html
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- 百度地图Api进阶教程-基础地图示例1.html
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- 百度地图Api进阶教程-弹出信息窗口5.html
<!DOCTYPE html> <html> <head> <meta name="viewport" content="ini ...
- 百度地图Api进阶教程-创建标注和自定义标注3.html
<!DOCTYPE html> <html> <head> <meta name="viewport" content="ini ...
- 百度地图Api进阶教程-默认控件和自定义控件2.html
<!DOCTYPE html> <html> <head> <meta name="viewport" content="ini ...
- 百度地图Api进阶教程-点聚合9.html
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- 百度地图Api进阶教程-用户自定义数据(标记和搜索)7.html
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- 百度地图Api进阶教程-地图鼠标左右键操作实例和鼠标样式6.html
<!DOCTYPE html> <html> <head> <meta name="viewport" content="ini ...
- 使用百度地图API进行Android地图应用开发（Eclipse）
随着基于位置的服务的兴起,地图类App呈现爆发趋势.随着而来的是地图供应商开放大量的API.供开发人员开发基于PC或者移动端的应用程序. 如今我们研究使用百度地图SDK进行Android项目的开发. ...
随机推荐
- Weex中文文档
这里整理当前已译出的Weex中文文档,如需查阅完整Weex文档,请访问http://alibaba.github.io/weex/doc/ . 同时也欢迎大家参与Weex中文文档翻译 [Guide] ...
- 重新想象 Windows 8.1 Store Apps (89) - 通信的新特性: 下载数据, 上传数据, 上传文件
[源码下载] 重新想象 Windows 8.1 Store Apps (89) - 通信的新特性: 下载数据, 上传数据, 上传文件 作者:webabcd 介绍重新想象 Windows 8.1 Sto ...
- 与众不同 windows phone (44) - 8.0 位置和地图
[源码下载] 与众不同 windows phone (44) - 8.0 位置和地图 作者:webabcd 介绍与众不同 windows phone 8.0 之 位置和地图 位置(GPS) - Loc ...
- Yii2学习笔记之场景
场景 一个模型可能在多个场景中使用,在不同的场景中,模型可能使用不同的业务逻辑和规则.例如, User 模型可能在用户登录时使用,也可能在用户注册时使用,某些属性可能在用户注册时强制要求有,在用户登录 ...
- HTML中行内元素的竖直方向的padding和margin是否真的无效
参考资料:Inline elements and padding 今天写一个导航栏时遇到了一个问题:行内元素的padding-top,padding-bottom和margin-top,margin- ...
- SAP RFC通信模式
在网络技术中,数据通信可以大致划分为两种基本模式:同步通信和异步通信. 其本义是:异步通信时,通信双方时钟允许存在一定误差:同步通信时,双方时钟的允许误差较小.在SAP的系统间的通信过程中,也借用术语 ...
- 破解 “PEDIY CrackMe 2007” 之 KeygenMe_1_by_boonz
系统 : Windows xp 程序 :KeygenMe_1_by_boonz 程序下载地址 :http://www.crackmes.de/users/boonz/keygenme_1_by_boo ...
- SharePoint 2013 单一页面赋设计权限
本文介绍SharePoint的使用中,断开单一页面权限,给用户编辑权限以及操作中遇到的问题,希望给相关需要的人一个参考. 1.首先进入页面库,找到我们的页面,进入共享,如下图: 2.在弹出的窗口中选择 ...
- 【转载】菜鸟Ubuntu下安装Android Studio
原文:http://forum.android-studio.org/forum.php?mod=viewthread&tid=236&extra=page%3D1%26filter% ...
- 安装VVDocumenter-Xcode-master (Xcode 7.1)的过程
下载地址: http://pan.baidu.com/s/1boxvewB 1.首先下载解压压缩包打开VVDocumenter工程,编译一遍(快捷键com+B) 2.在finder里面的应用程序,找到 ...