文档章节

腾讯地图标记点击事件

猪刚烈
 猪刚烈
发布于 2014/10/12 11:49
字数 181
阅读 68
收藏 0
<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>腾讯地图</title>
<script charset="utf-8" src="http://map.qq.com/api/js?v=2.exp&key=AMZBZ-NBWAR-SCKWS-WSFQU-TZ4R6-YWBEV"></script>
<script>
	var init = function() {
		var map_center = new qq.maps.LatLng(39.90927537429095,116.39838695526123);
		var map = new qq.maps.Map(document.getElementById("container"), {
			center : map_center,
			zoom : 14,
			panControl : true,
			zoomControl : true,
			zoomControlOptions : {
				style : qq.maps.ZoomControlStyle.SMALL
			}
		});

		var marker = new qq.maps.Marker( {
			map : map,
			position : map_center
		});

		var infoWin = new qq.maps.InfoWindow( {
			map : map
		});

		qq.maps.event.addListener(
				marker,
				'click',
				function(evt) {
					infoWin.open();
					infoWin.setContent('<div style="text-align:center;white-space:nowrap;margin:10px;">这里是天安门</div>');
					infoWin.setPosition(evt.latLng);
		        });
        
	 }
</script>
	</head>
	<body onload="init()">
		<div style="width: 603px; height: 300px; padding-top: 80px; padding-left: 80px;" id="container"></div>
	</body>
</html>


效果如图:

由于腾讯地图接口变更,这是之前的写法,现在的qq.maps 都改为了soso.maps

具体参考:http://api.map.soso.com/doc/example.html?sample-overlay-marker-click#5map#5map


作者:itmyhome

出处:http://blog.csdn.net/itmyhome1990/article/details/39551131






本文转载自:http://blog.csdn.net/itmyhome1990/article/details/39551131

共有 人打赏支持
猪刚烈
粉丝 22
博文 708
码字总数 110
作品 1
海淀
程序员
私信 提问
求教VB.NET关于自己写的控件添加鼠标事件问题

自己引用了一个地图控件Gmap,由于其未添加marker的点击事件,所以需要自己写鼠标事件 新建一个GGmarker类继承于地图控件的GmarkerGoogle public class GGmarker :inherits GmarkerGoogle ...

vv_zhao
2017/08/11
36
0
高德地图(AMap)JavaScript API的使用

申请JSAPI的开发者key 申请地址:http://lbs.amap.com/dev/key 引入高德地图JavaScript API文件: 创建地图容器 在页面body里你想展示地图的地方创建一个div 容器,并指定id标识: 指定容器大小...

驛路梨花醉美
2016/12/22
124
0
基于Html+js实现的瓦片式的Webgis栅格地图管理平台

基于Html+js实现的Webgis栅格平台 成都领君科技提供的基于HTML5+js开发的瓦片式地图发布平台,适用于几乎所有浏览器(IE6+,遨游,火狐,搜狗,谷歌,360,世界之窗,Opera等)。功能模块包括如...

成都领君科技
2012/04/04
0
0
微信接口 注意事项

当前发现两个需要注意的事项: 1、二维码扫描(scancode_push事件) 当用户点击菜单TYPE为scancode_push的菜单时微信会调用摄像头扫码; 当扫码成功后微信会通知服务方两个事件scan,scancode...

TANGJING2
2015/01/14
12
0
使用Javascript 实现 分享到 新浪微博 QQ 空间等

使用Javascript 实现 分享到 新浪微博 QQ 空间等 分类: JS2012-09-10 15:34 8196人阅读 评论(1) 收藏 举报 新浪微博javascriptqqurlfunction腾讯 我们阅读博客的时候经常会用到这样功能,当...

蜗牛奔跑
2015/07/30
0
0

没有更多内容

加载失败,请刷新页面

加载更多

开始看《Java学习笔记》

虽然书买了很久,但一直没看。这其中也写过一些Java程序,但都是基于IDE的帮助和对C#的理解来写的,感觉不踏实。 林信良的书写得蛮好的,能够帮助打好基础,看得出作者是比较用心的。 第1章概...

max佩恩
昨天
11
0
Redux 三大原则

1.单一数据源 在传统的MVC架构中,我们可以根据需要创建无数个Model,而Model之间可以互相监听、触发事件甚至循环或嵌套触发事件,这些在Redux中都是不被允许的。 因为在Redux的思想里,一个...

wenxingjun
昨天
7
0
跟我学Spring Cloud(Finchley版)-12-微服务容错三板斧

至此,我们已实现服务发现、负载均衡,同时,使用Feign也实现了良好的远程调用——我们的代码是可读、可维护的。理论上,我们现在已经能构建一个不错的分布式应用了,但微服务之间是通过网络...

周立_ITMuch
昨天
4
0
XML

学习目标  能够说出XML的作用  能够编写XML文档声明  能够编写符合语法的XML  能够通过DTD约束编写XML文档  能够通过Schema约束编写XML文档  能够通过Dom4j解析XML文档 第1章 xm...

stars永恒
昨天
2
0
RabbitMQ学习(2)

1. 生产者客户端 void basicPublish(String exchange, String routingKey, boolean mandatory, boolean immediate, BasicProperties props, byte[] body) 1. 在生产者客户端发送消息时,首先......

江左煤郎
昨天
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部