2

Googleマッシュアップの新機能です。Google マップに描画するために、Web サーバー (http://www.madisonareampo.org/maps/BRT_National.kmz) に KML があります。

クリック イベントによって KML 説明フィールドの内容を情報ウィンドウに表示する Google マップ マッシュアップがあります。KML ファイルは、ArcGIS を使用してジオデータベースからエクスポートされました。

KML ファイルのマーカーをクリックしても何も返されません。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Google Maps JavaScript API v3 Example: Street View Layer</title>
    <link href="/maps/documentation/javascript/examples/default.css" rel="stylesheet">
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBvkXCNOcIGLKZVgFtIykSQEbEk0db1XxY&sensor=false">
    </script>
    <script>

      function initialize() {
        var BRT = new google.maps.LatLng(40.380028, -93.440917);
        var mapOptions = {
          center: BRT,
          zoom: 3,
          overviewMapControl: true,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(
            document.getElementById('map_canvas'), mapOptions);

        var layer= new google.maps.KmlLayer('http://www.madisonareampo.org/maps/BRT_National.kmz',
          { suppressInfoWindows: true,
            map: map });

        google.maps.event.addListener(layer, 'click', function(kmlEvent) {
          showInContentWindow(kmlEvent.featureData.description);
        });

        function showInContentWindow(text) {
          var content = "<div style='margin-left:-20px;border:2px dotted #897823;'>" + text +  "</div>";
          var infowindow = new google.maps.InfoWindow({
            content: content 
          })
        }

        var panoramaOptions = {
          position: BRT,
          pov: {
            heading: 34,
            pitch: 10,
            zoom: 1
          }
        };
        var panorama = new google.maps.StreetViewPanorama(document.getElementById('pano'),panoramaOptions);
        map.setStreetView(panorama);
      }
    </script>
  </head>
  <body onload="initialize()">
    <div id="map_canvas" style="width: 650px; height: 400px"></div>
    <div id="pano" style="position:absolute; left:660px; top: 8px; width: 650px; height: 400px;"></div>
  </body>
</html>
4

1 に答える 1