1

Google マップで線を引こうとしましたが、このコードを試してみましたが、線ではなくマーカーだけで何も起こりませんでした。https://developers.google.com/maps/documentation/javascript/v2/のようなリファレンスを既に読んでいます。 overlays#Icons_overview してコードを試してみますが、まだ線が出ません。誰か助けてもらえますか? 以下は私のコードです、アドレスが配列であると仮定します

for (var i = 0; i < address.length; i++) {
    geocoder.geocode({ 'address': address[i] }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {

            if (i == 2) {
                var pos1 = results[0].geometry.location;
                alert(pos1);
            }

            else if (i == 2) {
                var pos2 = results[0].geometry.location;
                alert(pos2);
            }

            map.setCenter(results[0].geometry.location);
            var marker = new google.maps.Marker
            (
                {
                    position: results[0].geometry.location,
                    map: map,
                    title: 'click me'
                }
            );
            var infowindow = new google.maps.InfoWindow
            (
                {
                    content: '<img src="http://wallpaperscraft.com/image/child_girl_emotion_sweet_face_25641_100x100.jpg"> Welcome to origineit'
                }
            );
            var flightPlanCoordinates = [
                new google.maps.LatLng(pos1),
                new google.maps.LatLng(pos2)
              ];

            if (i == 2) {

                var polyline = new google.maps.Polyline
                ({
                    path: flightPlanCoordinates,
                    strokeColor: '#FF0000',
                    strokeOpacity: 0.8,
                    strokeWeight: 3
                });
                polyline.setMap(map);
            }

            google.maps.event.addListener(marker, 'click', function () {
                // Calling the open method of the infoWindow 
                infowindow.open(map, marker);
            });
        }
        else {
            alert('Geocode was not successful for the following reason: ' + status);
        }
    });
}
4

1 に答える 1

4

ここでの問題は、V2 からのポリラインを除くすべてに Google マップ V3 (使用する必要があります) を使用していることです。代わりに、Google マップ V3の API ドキュメントを読む必要があります。

Google マップ V3 の場合、次のようになります。

編集

あなたのコードをテストするとき（頭のてっぺんから答えを書くのではなく）、スコーピングの問題がいくつかあることに気付きました（if(i == 2)更新されたコードをチェックインする回避策に失敗したため、この記事をお勧めします問題の詳細をご覧ください）、それも変更しました。以下のコードは動作することがテストされています ( http://jsfiddle.net/YMyc9/ ) が、簡単に理解できるように少しリファクタリングする必要があります。

var pos1 = null; // These need to be declared outside of the geocode-callback
var pos2 = null; // so we also remove 'var' from the assignment inside of that function
for (var i = 0; i < address.length; i++) {
    geocoder.geocode({'address': address[i]}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {

            // We can't use 'i' here since this happens in a callback and the loop will already
            // have progressed and 'i' is (with my two test addresses) always 2 here.
            if (pos1 == null) {
                pos1 = results[0].geometry.location;
            }
            else if (pos2 == null) {
                pos2 = results[0].geometry.location;
            }
            else {
                /* We already got two so maybe quit? */
                return;
            }

            map.setCenter(results[0].geometry.location);
            var marker = new google.maps.Marker({
                position: results[0].geometry.location,
                map: map,
                title: 'click me'
            });
            var infowindow = new google.maps.InfoWindow({
                content: '<img src="http://wallpaperscraft.com/image/child_girl_emotion_sweet_face_25641_100x100.jpg"> Welcome to origineit'
            });

            /* NEW CODE HERE */
            if (pos2 != null) {
                var polyline = new google.maps.Polygon({
                    paths: [pos1, pos2],
                    strokeColor: '#FF0000',
                    strokeOpacity: 0.8,
                    strokeWeight: 3,
                    fillColor: '#FF0000',
                    fillOpacity: 0.35
                });

                polyline.setMap(map);
            } /* BACK TO THE OLD CODE HERE */

            google.maps.event.addListener(marker, 'click', function() {
                // Calling the open method of the infoWindow 
                infowindow.open(map, marker);
            });
        }
        else {
            alert('Geocode was not successful for the following reason: ' + status);
        }
    });
}
于 2012-12-28T02:25:24.370 に答える