0

私は最初の Fusion Tables を作成し、2 つの Fusion Tables を Google マップに取り込みます。1 つは多角形で、もう 1 つはポイントです。ポリゴンまたはポイントをクリックしたときに通常の情報ウィンドウを表示する代わりに、Fusion Table からいくつかのデータを取得したいのですが、うまくいきません:

<script>
  function initialize() {
    var england = new google.maps.LatLng(53.2, -2);
    map = new google.maps.Map(document.getElementById('map_canvas'), {
      center: england,
      zoom: 8,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    layer1 = new google.maps.FusionTablesLayer({
      query: {select: 'geometry', from: '1HgGUc72F2Wlp6dvy4GWvLyWrl1kC6aJhnM7jPyc'},
      styles: [
        { where: "Score = 0", polygonOptions: { fillColor: "#cdcdcd", fillOpacity: 0.3 } },
        { where: "Score = 1", polygonOptions: { fillColor: "#FF0000", fillOpacity: 0.5 } },
        { where: "Score = 2", polygonOptions: { fillColor: "#FF7E00", fillOpacity: 0.5 } },
        { where: "Score = 3", polygonOptions: { fillColor: "#008000", fillOpacity: 0.5 } }],
    options: {suppressInfoWindows: true},
    map: map,
    });
    google.maps.event.addListener(layer1, 'click', function(e) {e.infoWindowHtml = "Score" + e.row['Score'].value;}
    });

    layer2 = new google.maps.FusionTablesLayer({
    query: {select: 'postcode', from: '1bawAKwQAUGE4mzYSyw4lTbOcgp7MgIGOLROel8Y'},
    options: {suppressInfoWindows: true},
    map: map,
     });
    google.maps.event.addListener(layer2, 'click', function(e) {e.infoWindowHtml = "Postcode" + e.row['Postcode'].value;}
    });

    google.maps.event.addDomListener(window, 'load', initialize);

  }
</script>
</head>
<body onLoad="initialize()">
  <div id="map_canvas"></div>
</body>
</html>

AddListenerとaddDomListenersを追加するまで、すべてうまく機能し、infowindowsは抑制されていました。誰か私が軌道に戻るのを手伝ってくれませんか？

4

2 に答える 2

2
  1. 「新しい」コードに構文エラーがあります (2 つの余分な「}」)

  2. 初期化関数内に addDomListener への呼び出しがあります (まだ<bodyタグ内にあるので問題ありませんが、実際には両方の場所にあるべきではありません。

    <script>
 function initialize() {
 var england = new google.maps.LatLng(53.2, -2);
map = new google.maps.Map(document.getElementById('map_canvas'), {
  center: england,
  zoom: 8,
  mapTypeId: google.maps.MapTypeId.ROADMAP
});

layer1 = new google.maps.FusionTablesLayer({
  query: {select: 'geometry', from: '1HgGUc72F2Wlp6dvy4GWvLyWrl1kC6aJhnM7jPyc'},
  styles: [
    { where: "Score = 0", polygonOptions: { fillColor: "#cdcdcd", fillOpacity: 0.3 } },
    { where: "Score = 1", polygonOptions: { fillColor: "#FF0000", fillOpacity: 0.5 } },
    { where: "Score = 2", polygonOptions: { fillColor: "#FF7E00", fillOpacity: 0.5 } },
    { where: "Score = 3", polygonOptions: { fillColor: "#008000", fillOpacity: 0.5 } }],
options: {suppressInfoWindows: true},
map: map,
});
google.maps.event.addListener(layer1, 'click', function(e) {e.infoWindowHtml = "Score" + e.row['Score'].value;});
layer2 = new google.maps.FusionTablesLayer({
query: {select: 'postcode', from: '1bawAKwQAUGE4mzYSyw4lTbOcgp7MgIGOLROel8Y'},
options: {suppressInfoWindows: true},
map: map,
 });
 google.maps.event.addListener(layer2, 'click', function(e) {e.infoWindowHtml = "Postcode" + e.row['Postcode'].value;});
 }
 google.maps.event.addDomListener(window, 'load', initialize);
 </script>
 </head>
  <body>
   <div id="map_canvas"></div>
</body>
</html>

この関数を使用して、各レイヤーの情報ウィンドウが機能するように変更された作業例:

function openIW(FTevent) {
  // infoWindow.setContent(FTevent.infoWindowHtml);
  // infoWindow.setPosition(FTevent.latLng);
  infoWindow.setOptions(
    { 
     content: FTevent.infoWindowHtml,
     position: FTevent.latLng,
     pixelOffset: FTevent.pixelOffset
    });
  infoWindow.open(map);
}
于 2013-01-13T19:38:24.753 に答える
0 
google.maps.event.addListener(layer, 'click', function(e) {
    console.log("E.Row! : "+ e.row['name'].value);
});
于 2016-12-26T06:06:45.710 に答える