如何在Google地图中显示多个位置?

时间:2011-11-25 01:52:01

标签: api google-maps google-maps-api-3

我有多个经度和纬度数据,我想用gop在google地图中显示它们。

如何使用Google地图API执行此操作?

2 个答案:

答案 0 :(得分:9)

迭代数组,并为每对创建一个新的Marker实例。这很简单:

<script>
    var map = new google.maps.Map(document.getElementById('map'), {
        center: new google.maps.LatLng(55.378051, -3.435973),
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        zoom: 8
    });

    var locations = [
        new google.maps.LatLng(54.97784, -1.612916),
        new google.maps.LatLng(55.378051, -3.435973])
        // and additional coordinates, just add a new item
    ];

    locations.forEach(function (location) {
        var marker = new google.maps.Marker({
            position: location,
            map: map
        });
    });
</script>

这适用于任意数量的纬度/经度对;只需在locations数组中添加一个新项目。

答案 1 :(得分:0)

你可以做点什么

   var map = new GMap2(document.getElementById("map_canvas"));
    map.addControl(new GSmallMapControl());
    map.setCenter(new GLatLng(37.4419, -122.1419), 13);

    // Create our "tiny" marker icon
    var blueIcon = new GIcon(G_DEFAULT_ICON);
    blueIcon.image = "http://www.google.com/intl/en_us/mapfiles/ms/micons/blue-dot.png";

    // Set up our GMarkerOptions object
    markerOptions = { icon:blueIcon };

    // Add 10 markers to the map at random locations
    var bounds = map.getBounds();
    var southWest = bounds.getSouthWest();
    var northEast = bounds.getNorthEast();
    var lngSpan = northEast.lng() - southWest.lng();
    var latSpan = northEast.lat() - southWest.lat();
    for (var i = 0; i < 10; i++) {
      var point = new GLatLng(southWest.lat() + latSpan * Math.random(),
        southWest.lng() + lngSpan * Math.random());
      map.addOverlay(new GMarker(point, markerOptions));
    }

我从google API文档中获取了这个示例,他们已经展示了如何使用lat ong来显示内容

详情请参阅

Showing markers using Google API

虽然我已经使用了已被弃用的v2,但使用的概念或多或少相同