0

緯度と経度の値を含むPHP配列からGoogleマップにマーカーを表示しようとしています。

現在、PHP配列は次のようになっています。

Array
(
[0] => Array
    (
        [0] => 55.8490116, -4.222272800000042
        [1] => 54.5979369, -7.274279400000069
    )

[1] => Array
    (
        [0] => 55.8490116, -4.222272800000042
    )

)

次に、この配列をPHPのJS配列に次のように追加します。

<script type="text/javascript">
var markers = <?php echo $myarray; ?>;
</script>

そして、マップのJSでは次のようになります。

var infowindow = new google.maps.InfoWindow();
var marker, i;
var bounds = new google.maps.LatLngBounds();

console.log(markers);

for (i = 0; i < markers.length; i++) { 

    var pos = new google.maps.LatLng(markers[1][0]);

    marker = new google.maps.Marker({
        position: pos,
        map: map
    });

    google.maps.event.addListener(marker, 'click', (function(marker, i) {

        return function() {
            infowindow.setContent(markers[1][0]);
            infowindow.open(map, marker);
        }

    })(marker, i));

}

次にどこに行けばいいのかわからない。自分のアレイがGoogleMapsAPIに必要なものを模倣していないことは知っていますが、それに合わせてアレイを変更する方法がわかりません。

ありがとうロバート

4

2 に答える 2

2

あなたのアプローチの問題は、アレイをエコーすることだと思います。

私が修正しようとする方法は、JSでと呼ばれる空の配列を作成しmarkers、PHP配列のすべての値をループしてから、各値をに追加することmarkersです。

また、PHPには配列の配列があるため、ネストされたループが必要になることに注意してください。

コードサンプルが必要な場合はお知らせください。必要な場合はこれで十分です。

于 2012-10-31T14:34:33.733 に答える
0

あなたはこのようにすることができます：

<?php
$marker[] = array(
                "lat"=> '17.454000',
                "lng"=> '78.434952');
$marker[] = array(
                "title"=> 'shilparamam',
                "lat"=> '17.452665',
                "lng"=> '78.435608',
                "description"=> 'Mumbai formerly Bombay, is the capital city of the Indian state of Maharashtra.');
$marker[] = array(
                "title"=> 'image hospitals',
                "lat"=> '17.452421',
                "lng"=> '78.435715',
                "description"=> 'Pune is the seventh largest metropolis in India, the second largest in the state of Maharashtra after Mumbai.');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>    
    <script type="text/javascript">
        <?php
        $objJSON = json_encode($marker);
        echo "var markers  = ". $objJSON . ";\n";
        ?>
        window.onload = function () {
            var mapOptions = {
                center: new google.maps.LatLng(markers[0].lat, markers[0].lng),
                zoom: 10,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            var map = new google.maps.Map(document.getElementById("dvMap"), mapOptions);
            var infoWindow = new google.maps.InfoWindow();
            var lat_lng = new Array();
            var latlngbounds = new google.maps.LatLngBounds();
            for (i = 0; i < markers.length; i++) {
                var data = markers[i]
                var myLatlng = new google.maps.LatLng(data.lat, data.lng);
                lat_lng.push(myLatlng);
                var marker = new google.maps.Marker({
                    position: myLatlng,
                    map: map,
                    title: data.title
                });
                latlngbounds.extend(marker.position);
                (function (marker, data) {
                    google.maps.event.addListener(marker, "click", function (e) {
                        infoWindow.setContent(data.description);
                        infoWindow.open(map, marker);
                    });
                })(marker, data);
            }
            map.setCenter(latlngbounds.getCenter());
            map.fitBounds(latlngbounds);

        }
    </script>
    <div id="dvMap" style="width: 500px; height: 500px">
    </div>
</body>
</html>
于 2015-08-14T08:21:07.383 に答える