加载谷歌地图标记HTML的要求
Load Google Map marker HTML on request
是否可以加载谷歌地图标记的内容(即在"工具提示"中显示的HTML),只有当用户实际点击它?
我在我们的网站上嵌入了一个很好的谷歌地图,它工作得很好-一次只有200个标记。但是现在我们想要显示大量的标记(3900多个),并且目前用于显示工具提示的所有小HTML页面都是在添加标记时设置的。理想情况下,这个HTML应该使用AJAX加载。
是的,当您添加到地图中的标记被单击时,您需要通过向该标记添加一个单击侦听器来加载所需的数据。
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3&sensor=true_or_false"
type="text/javascript"></script>
<div id="map_canvas"> </div>
<script>
var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
var myOptions = {
zoom: 4,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title:"Hello World!"
});
google.maps.event.addListener(marker, 'click', function() {
// When clicked on the marker I use jquery to request some Html
// then show in the contents of an info window
$.ajax({
url: 'http://www.test.com/get-data/',
dataType: 'html',
success: function (data) {
var infowindow = new google.maps.InfoWindow(
{ content: data,
size: new google.maps.Size(50,50),
position: marker.position
});
infowindow.open(map);
}
});
});
</script>
相关文章:
- 谷歌地图不是以HTML显示,而是在JS Fiddle上工作
- 这是使用html快照和谷歌获取的预期结果吗?SEO/SPA
- 应用程序脚本中导入HTML的数据擦除;谷歌表格
- 谷歌文档如何拦截Ctrl-S/Command-S来保存文档而不是html页面
- 如何使用谷歌脚本将html表单数据保存到谷歌电子表格中
- 如何打开文件对象(HTML)并在谷歌应用程序脚本中解析它
- 谷歌应用程序脚本html服务和加载谷歌地图javascript api V3
- HTML/CSS/JS切换不同的谷歌日历是同一个框架
- 旋转谷歌地图嵌入在html中
- 谷歌电子表格的 HTML 输入字段
- 为什么谷歌跟踪代码管理器不能安装在正文下的另一个HTML元素中
- 将坐标传递到HTML页面以在新窗口中打开谷歌街景
- 以类似于谷歌机器人的方式抓取网站html和javascript
- 如何将纬度经度从HTML表单传递到谷歌地图
- 在html中使用谷歌脚本api
- 谷歌脚本-从网站论坛解析HTML-并将数据写入工作表
- 谷歌地图/融合表Javascript HTML赢得't显示/可视化所有多边形数据(通过色标)
- 谷歌脚本从code.gs返回到index.html
- 如果JavaScript标签是通过谷歌标签管理器插入到页面上的,那么它们的延迟程度是多少;s的自定义HTML
- 在谷歌地图HTML中简单地添加KML图层