0

まあ、私はこれにしばらく費やしましたが、多くのチュートリアルと例の助けを借りて、つまずき、ここまで来ました。

それぞれ個別の InfoWindow を持つ複数のポリゴンを作成する必要があります。私はそれを持っていると思いますが、setMap に問題があります。これは私が持っている距離です:

型エラーの取得

object #<object> has no method 'setMap'

このエラーを修正するにはどうすればよいですか?

<script>
var map;
var infoWindow;

function initialize() {
  var myLatLng = new google.maps.LatLng(24.886436490787712, -70.2685546875);
  var mapOptions = {
    zoom: 5,
    center: myLatLng,
    mapTypeId: google.maps.MapTypeId.TERRAIN
  };

map = new google.maps.Map(document.getElementById("map_canvas"),
      mapOptions);

  // Let's start with an empty object:
var countries = {    
};

// Now let's add a county polygon:
countries['UK'] = new google.maps.Polygon({
  paths: [
    new google.maps.LatLng(59.677361, -2.469846),
    new google.maps.LatLng(59.299717,   -6.314917),
    new google.maps.LatLng(57.877247,   -9.314917),
    new google.maps.LatLng(54.428078,  -11.638861),
    new google.maps.LatLng(51.784554,  -11.702241),
    new google.maps.LatLng(50.185848,  -10.054354),
    new google.maps.LatLng(49.405380,   -7.012100),
    new google.maps.LatLng(49.090675,   -3.272664),
    new google.maps.LatLng(48.775970,   -1.709283),
    new google.maps.LatLng(49.757851,   -2.089565),
    new google.maps.LatLng(50.714554,    1.037195),
    new google.maps.LatLng(51.482437,    2.304801),
    new google.maps.LatLng(53.433609,    3.276632),
    new google.maps.LatLng(55.863132,    3.445646)
    // ...
  ],
  strokeColor: "#FF0000",
  strokeOpacity: 0.8,
  strokeWeight: 2,
  fillColor: "#FF0000",
  fillOpacity: 0.3
});

// Next county:
countries['FR'] = new google.maps.Polygon({
  paths: [
    // This is not real data:
    new google.maps.LatLng(25.774252, -80.190262),
    new google.maps.LatLng(18.466465, -66.118292),
    new google.maps.LatLng(32.321384, -64.757370),
    new google.maps.LatLng(25.774252, -80.190262)
    // ...
  ],
  strokeColor: "#FF0000",
  strokeOpacity: 0.8,
  strokeWeight: 2,
  fillColor: "#FF0000",
  fillOpacity: 0.3
});

// And so on...

countries.setMap(map)

;
  // Add a listener for the click event
  google.maps.event.addListener(UK, 'click', showInfoUK);
  google.maps.event.addListener(FR, 'click', showInfoFR);

  infowindow = new google.maps.InfoWindow();
}

function showInfoUK(event) {
    var contentString = "<b>UK</b><br />";
        contentString += "UK, Channel Islands, Ireland";



  // Replace our Info Window's content and position
  infowindow.setContent(contentString);
  infowindow.setPosition(event.latLng);

  infowindow.open(map);
}
function showInfoFR(event) {
    var contentString = "<b>FR</b><br />";
        contentString += "France, N,W";



  // Replace our Info Window's content and position
  infowindow.setContent(contentString);
  infowindow.setPosition(event.latLng);

  infowindow.open(map);
}

</script>
4

4 に答える 4

1

Javascript には、たとえば php のようなキーへの参照がないため、countries['UK'] を設定することはできません。数字キーを使用する必要があります。したがって、構文は次のようになります。

countries[0] = new google.maps.Polygon({ ... });
countries[1] = new google.maps.Polygon({ ... });

私はあなたの例を機能させました:

http://jsfiddle.net/AcCzT/15/

微調整可能。完璧ではありません。それはただの迅速な修正です。そこから先に進むことができます

于 2012-12-14T10:16:26.673 に答える
0

コードには 2 つの問題があります。

  1. マルセロが言ったこと、ポリゴンをマップに追加するには、次を使用します。countries["UK"].setMap(map);
  2. クリック リスナーを追加するには、ポリゴンを参照する必要があります。google.maps.event.addListener(countries["UK"], 'click', showInfoUK);

実施例

于 2012-12-14T14:06:02.303 に答える
0

ajax をより簡単に、より単純に使用します。例えば、

downloadUrl("url", function(data) {
    for (var i = 0; i < polygons.length; i++) {
        ........
        var decodedPath = ........
        polygon.setMap(map);
        ........
    }
});
于 2012-12-14T10:20:08.370 に答える
0

Javascript 配列にはメソッドがありません.setMap()。google.maps.Polygon() オブジェクトが行います。さらに、countries['UK'] などの JavaScript には連想配列はありません。

これはうまくいくかもしれません:

countries['UK'].setMap(map);

しかし、それは正しくありません。

于 2012-12-14T09:57:15.580 に答える