栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

JavaScript Google Maps JS API v3-简单多个标记示例

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

JavaScript Google Maps JS API v3-简单多个标记示例

这是我可以简化为的最简单的方法:

<!DOCTYPE html><html> <head>   <meta http-equiv="content-type" content="text/html; charset=UTF-8" />   <title>Google Maps Multiple Markers</title>   <script src="http://maps.google.com/maps/api/js?sensor=false"type="text/javascript"></script></head> <body>  <div id="map" ></div>  <script type="text/javascript">    var locations = [      ['Bondi Beach', -33.890542, 151.274856, 4],      ['Coogee Beach', -33.923036, 151.259052, 5],      ['Cronulla Beach', -34.028249, 151.157507, 3],      ['Manly Beach', -33.80010128657071, 151.28747820854187, 2],      ['Maroubra Beach', -33.950198, 151.259302, 1]    ];    var map = new google.maps.Map(document.getElementById('map'), {      zoom: 10,      center: new google.maps.LatLng(-33.92, 151.25),      mapTypeId: google.maps.MapTypeId.ROADMAP    });    var infowindow = new google.maps.InfoWindow();    var marker, i;    for (i = 0; i < locations.length; i++) {        marker = new google.maps.Marker({        position: new google.maps.LatLng(locations[i][1], locations[i][2]),        map: map      });      google.maps.event.addListener(marker, 'click', (function(marker, i) {        return function() {          infowindow.setContent(locations[i][0]);          infowindow.open(map, marker);        }      })(marker, i));    }  </script></body></html>


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/411312.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号