0

私は自分のページでポリラインを動的にレンダリングしようとしています.Hereはそうすることを意図している私のjavascript関数です:

function decodePath(){
var pathArray=[];
window.alert(("here!!!"));
pathArray=[
    new google.maps.LatLng(25.774252, -80.190262),
    new google.maps.LatLng(18.466465, -66.118292),
    new google.maps.LatLng(32.321384, -64.75737)
];

var flightPath = new google.maps.Polyline({
path: pathArray,
strokeColor: '#FF0000',
strokeOpacity: 1.0,
strokeWeight: 2
});
poly = new google.maps.Polyline(flightPath);
poly.setMap(map);
}

上記の機能が付属しているボタンは次のとおりです。

<input type="button" onclick="decodePath();" value="Decode Path"/>

マップがレンダリングされる div は次のとおりです。

<div id="map"></div>

これが私が初期化する方法です：

function initialize() {
  var rendererOptions = {
    draggable: true
  };    

  var chicago = new google.maps.LatLng(41.850033, -87.6500523);
  var mapOptions = {
    zoom:7,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    center: chicago
  }
  map = new google.maps.Map(document.getElementById('map'), mapOptions);

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

私はGoogleマップAPI https://developers.google.com/maps/documentation/javascript/examples/,https://developers.google.com/maps/documentation/javascript/referenceを研究しましたが、特に私が試しているのはこの例に基づいています。ポリラインを動的に追加したいだけです。では、パスがマップに表示されないのはなぜですか?

4

1 に答える 1

1

マップをポリラインの中心に配置していないため、ポリラインが表示されません。以下のコードを「DecodePath」関数に追加して、マップをポリラインの中央に配置します。

  var bounds = new google.maps.LatLngBounds();
  for (var i=0; i<pathArray.length;i++){
    bounds.extend(pathArray[i]);
  }
  map.fitBounds(bounds);
于 2013-07-02T04:14:24.097 に答える