如何在Google地圖上顯示多個經度和緯度

Question

我在PHP的數組中有多個LAT / LONG，但是可用於顯示lat / long的代碼是顯示單個lat / long，我嘗試在for循環中迭代該數組，但如下所示無效：

<html>
    <head>
        <style type="text/css">
            div#map {
                position: relative;
            }

            div#crosshair {
                position: absolute;
                top: 192px;
                height: 19px;
                width: 19px;
                left: 50%;
                margin-left: -8px;
                display: block;
                background: url(crosshair.gif);
                background-position: center center;
                background-repeat: no-repeat;
            }
        </style>
        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
        <script type="text/javascript">
            var map;
            var geocoder;
            var centerChangedLast;
            var reverseGeocodedLast;
            var currentReverseGeocodeResponse;

            function initialize() {
                <?php for($i=0;$i<count($data);$i++){?>
                var latlng = new google.maps.LatLng(<?php echo $data[$i]['lat'].','.$data[$i]['long']; ?>);
                var myOptions = {
                    zoom: 40,
                    center: latlng,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
                geocoder = new google.maps.Geocoder();

                var marker = new google.maps.Marker({
                    position: latlng,
                    map: map,
                    title: "<?php echo $data[$i]['deviceID'];?>"
                });
                <?php }?>
            }

        </script>
    </head>
    <body onLoad="initialize()">
        <div id="map" style="width:200px; height:200px">
            <div id="map_canvas" style="width:100%; height:200px"></div>
            <div id="crosshair"></div>
        </div>


    </body>
</html>

我懷疑javasctipt代碼中必須有一些參數multiple才能使此工作有效，但不確定...對此可以有些幫助。

Answer 1

您將在每次迭代中創建新map 。 將map定義和geocoder定義放置在foreach之外：

function initialize() {
    var myOptions = {
        zoom: 40,
        center: latlng,   // set some default latlng here, e.g $data[0]['lat'], $data[0]['lng']
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    geocoder = new google.maps.Geocoder();
    <?php for($i=0;$i<count($data);$i++){?>
    var latlng = new google.maps.LatLng(<?php echo $data[$i]['lat'].','.$data[$i]['long']; ?>);
    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        title: "<?php echo $data[$i]['deviceID'];?>"
    });
    <?php }?>
}

如何在Google地圖上顯示多個經度和緯度

問題描述

1 個解決方案

解決方案1
1 2013-08-15 17:57:00

如何在Google地圖上顯示多個經度和緯度

問題描述

1 個解決方案

解決方案1 1 2013-08-15 17:57:00

解決方案1
1 2013-08-15 17:57:00