0

オーバーレイされたポリラインの例のソース コードを Google Maps API からコピーしましたが、.htm ファイルからそのコードを実行しても何も表示されません。私はhtml、javascript、CSSについて学んでいますが、この答えを自分で解決することはできません. これまでのコードは次のとおりです。

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Google Maps JavaScript API v3 Example: Polyline Simple</title>
<link href="/maps/documentation/javascript/examples/default.css" rel="stylesheet">
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>

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

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

    var flightPlanCoordinates = [
        new google.maps.LatLng(37.772323, -122.214897),
        new google.maps.LatLng(21.291982, -157.821856),
        new google.maps.LatLng(-18.142599, 178.431),
        new google.maps.LatLng(-27.46758, 153.027892)
    ];
    var flightPath = new google.maps.Polyline({
      path: flightPlanCoordinates,
      strokeColor: '#FF0000',
      strokeOpacity: 1.0,
      strokeWeight: 2
    });

    flightPath.setMap(map);
  }
 </script>
 </head>
 <body onload="initialize()">
 <div id="map_canvas"></div>
 </body>
 </html>
4

1 に答える 1

2

あなたはそれを見ることができないだけです。次のスタイルを追加します。

#map_canvas{
    height:500px;
}

フィドル: http://jsfiddle.net/ax6wg/

于 2013-02-23T14:43:57.410 に答える