1

このトピックに関する議論をこのサイトで見たことがあります。提案されたコードにできる限り厳密に従ってみましたが、うまくいきませんでした。次のコードが修正される可能性があるかどうか、または基本的な Google の法律に違反していないかどうか、誰か教えてもらえますか? それがしようとしているのは、同じ地理位置情報コードを使用して同じページ上の 2 つのマップに 1 つの四角形の配列を使用して、ユーザーの場所を表すマーカーを配置することです。2 つのマップのズーム、中心、および機能が異なるため (それぞれが表示される div のサイズと同様に)、2 セットのオプションを提供しました。最初の地図は、ユーザーの位置を中心にして道路レベルにズームされています。2 つ目は、四角形レイヤーの全範囲をユーザーの位置とともに表示するように中央に配置されたワイド ビューです。これは、私が見た例よりも少し複雑なので、うまくいかない可能性があり、2 つの完全に別個のコード ブロックが必要です。完全な長方形配列コードを繰り返さなければならないのは残念ですが...

提案をありがとう。

<script src="http://maps.google.com/maps/api/js?sensor=false">
</script><script type="text/javascript">
if (navigator.geolocation) {navigator.geolocation.getCurrentPosition(function(position){
    var latitude = position.coords.latitude;
    var longitude = position.coords.longitude;
    var coords = new google.maps.LatLng(latitude, longitude);
    var map,map2;
    var mapOptions1 = {
        zoom: 16,
        center: coords,
        draggable: false, 
        zoomControl: false, 
        scrollwheel: false, 
        disableDoubleClickZoom: true,
        mapTypeId: google.maps.MapTypeId.ROADMAP
        };
    var mapOptions2 = {
        zoom: 5,
        center: new google.maps.LatLng(0, 0),
        mapTypeControl: true,
        mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById("mapContainer1"), mapOptions1);
        map2 = new google.maps.Map(document.getElementById("mapContainer2"), mapOptions2);
 var marker = new google.maps.Marker({
                position: coords,
                map: map,map2

                           });
 marker.setIcon('sites/default/files/YourLocation_0.png')
 var rectangles = [];

rectangles[0]=new google.maps.Rectangle({
bounds:new google.maps.LatLngBounds(new google.maps.LatLng(a,b),new google.maps.LatLng(x, y)),
map:map,map2,
fillOpacity: 0,
strokeOpacity: 0,
url: 'http://example.com',
clickable: true
});
rectangles[1]=new google.maps.Rectangle({
bounds:new google.maps.LatLngBounds(new google.maps.LatLng(aa, bb),new google.maps.LatLng(xx, yy)),
map:map,map2,
fillOpacity: 0,
strokeOpacity: 0,
url: 'http://example2.com',
clickable: true
});
rectangles[2]=new google.maps.Rectangle({
bounds:new google.maps.LatLngBounds(new google.maps.LatLng(aaa, bbb),new google.maps.LatLng(xxx, yyy)),
map:map,map2,
fillOpacity: 0,
strokeOpacity: 0,
url: 'http://example3.com',
clickable: true
});

[.....もっとたくさんの長方形....]

for ( i = 0; i < rectangles.length; i++ ){google.maps.event.addListener(rectangles[i], 'click', function() {window.location.href = this.url;
});
}

layer.setMap(map);
layer.setMap(map2);
    });
}else {
    alert("Geolocation API is not supported in your browser.");
}

 
 

4

1 に答える 1

0

これは機能しません:

rectangles[0]=new google.maps.Rectangle({
  bounds:new google.maps.LatLngBounds(new google.maps.LatLng(a,b),new google.maps.LatLng(x, y)),
  map:map,map2,
  fillOpacity: 0,
  strokeOpacity: 0,
  url: 'http://example.com',
  clickable: true
});

マップごとに個別の長方形を作成する必要があります (長方形は一度に 1 つのマップにしか存在できません) 次のようなものです (これにより、2 次元配列が作成されます。[1] はマップ用、[2] は map2 用です)。

rectangles[1][0]=new google.maps.Rectangle({
  bounds:new google.maps.LatLngBounds(new google.maps.LatLng(a,b),new google.maps.LatLng(x, y)),
  map:map,
  fillOpacity: 0,
  strokeOpacity: 0,
  url: 'http://example.com',
  clickable: true
});

rectangles[2][0]=new google.maps.Rectangle({
  bounds:new google.maps.LatLngBounds(new google.maps.LatLng(a,b),new google.maps.LatLng(x, y)),
  map:map2,
  fillOpacity: 0,
  strokeOpacity: 0,
  url: 'http://example.com',
  clickable: true
});
于 2012-12-15T16:25:37.670 に答える