为什么谷歌地图不绘制折线?

时间:2012-08-10 10:23:20

标签: google-maps google-maps-api-3

我在谷歌地图上制作折线。但我看不到它。以下是代码:

  $('#mapdiv').html('<div id="map_convas" style="width:640px; height:427px; margin-left:auto; margin-right:auto"></div>');

  var centerLatLng = new google.maps.LatLng(obj[i].centerlat, obj[i].centerlong);

  var myOptions = {
   center: centerLatLng,
   zoom: 17,
   mapTypeId: google.maps.MapTypeId.ROADMAP,
   draggable: true
  };
  var map_polyline;

  var map = new google.maps.Map(document.getElementById("map_convas"),
                                myOptions);

  var marker = new google.maps.Marker({
   clickable: true,
   position: centerLatLng,
   map: map,
   zIndex: 1
  });
  marker.setIcon('http://localhost:8888/images/marker.png');

  var locations = obj[0].locations;
// in my current case locations.length is 1                       
  for(var p=0; p<locations.length; p++){

  var triangleCoords = new Array();

  var markerArray = locations[p];
  for(var x=0;x<markerArray.length;x++){
        triangleCoords.push(new google.maps.LatLng(markerArray[x].latitude, markerArray[x].longitude));
  }
  map_polyline = new google.maps.Polyline({
       path: triangleCoords,
       strokeColor: "#FF0000",
       strokeOpacity: 1.0,
       strokeWeight: 2
  });
  map_polyline.setMap(map);
 }

 // doing some stuff

 google.maps.event.trigger(map, "resize");

我正在解析并制作obj的Json如下:

 [
{
    "centerlat": 55.68369272317236,
    "centerlong": 13.176000376097194,
    "locations": [
        [
            {
                "longitude": 13.17480473780369,
                "latitude": 13.17480473780369
            },
            {
                "longitude": 13.17456847989296,
                "latitude": 13.17456847989296
            },
            {
                "longitude": 13.17426541821395,
                "latitude": 13.17426541821395
            },
            {
                "longitude": 13.1741324253503,
                "latitude": 13.1741324253503
            },
            {
                "longitude": 13.17386236043011,
                "latitude": 13.17386236043011
            },
            {
                "longitude": 13.17352138460909,
                "latitude": 13.17352138460909
            }
        ]
    ]
  }
 ]

我正在使用以下代码行解析它:

 var obj = jQuery.parseJSON(result);

其他一切像地图中心,标记和大小都很好。唯一的问题是我在地图上看不到任何折线。我发出警告来检查markerArray和triangleCoords的值。他们很好。谁能告诉我为什么我看不到折线?我以前使用更多的地图。因为它们有什么问题吗?提前谢谢。

0 个答案:

没有答案