无法通过传递lat-long数组

时间:2015-05-16 13:36:38

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

var mycenter=new google.maps.LatLng(22.352319,82.605569);
var map;
var poly1;
var ary=new Array();
function initialize()
{
    var mapprop={
        center:mycenter,
        zoom:6,
        mapTypeId:google.maps.MapTypeId.ROADMAP
    };

    map=new google.maps.Map(document.getElementById("mapholder"),mapprop);

    poly1=new google.maps.Polyline({
        strokeColor: '#ff004c',
        strokeOpacity: 1.0,
        strokeWeight: 3
    });

    poly1.setMap(map);
    testmarker();
}

function showmarker(ary)
{
    var path=poly1.getPath();
    map.setZoom(15);
    path.push(ary);
    poly.setPath(path);  // this line doesn't execute
    alert(ary);    
}

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

这里我试图通过函数showmarker()设置折线的路径。数组ary包含lat-long值。我想用ary中的值显示折线。 ary包含的值类似于以下[(lat,long),(lat,long),...]。我无法通过在其路径中传递此数组来显示折线。 poly1.setPath(path)根本没有执行。

2 个答案:

答案 0 :(得分:1)

你不能直接推动路径(ary),它是一个数组,但是多边形路径由LatLngs组成。

您必须遍历这些项目并推送单个项目(LatLngs)

function initialize() {

  var mapprop = {
      center: new google.maps.LatLng(22, 82),
      zoom: 6
    },
    map = new google.maps.Map(document.getElementById("mapholder"), mapprop),
    poly1 = new google.maps.Polyline({
      map: map,
      path: [new google.maps.LatLng(22, 82.4),
        new google.maps.LatLng(21.7, 83)
      ]
    });
  showmarker([new google.maps.LatLng(22, 82),
      new google.maps.LatLng(21, 83),
      new google.maps.LatLng(22.5, 81),
      new google.maps.LatLng(20, 80)
    ],
    poly1
  );
}

function showmarker(
  path, //LatLng-Array
  poly //target-polygon
) {

  path.forEach(function(coord) {
    //note: getPath returns a reference,
    //you may add a point directly
    poly.getPath().push(coord);
  });
}
google.maps.event.addDomListener(window, 'load', initialize);
html,
body,
#mapholder {
  height: 100%;
  margin: 0;
  padding: 0
}
<script src="https://maps.googleapis.com/maps/api/js?v=3"></script>
<div id="mapholder"></div>

答案 1 :(得分:0)

<script>

var mycenter=new google.maps.LatLng(22.352319,82.605569);
var map;
var poly1;
var ary=new Array();
function initialize()
{
var mapprop={
center:mycenter,
zoom:6,
mapTypeId:google.maps.MapTypeId.ROADMAP
};

map=new google.maps.Map(document.getElementById("mapholder"),mapprop);

// var polyoptions={ strokeColor: '#000000',
    // strokeOpacity: 1.0,
    // strokeWeight: 3
  // };
  poly1=new google.maps.Polyline({
  strokeColor: '#ff004c',
    strokeOpacity: 1.0,
    strokeWeight: 3

  });

  poly1.setMap(map);




}

function showmarker(ary)
{

var path=poly1.getPath();
map.setZoom(15);
var i;
for(i=0;i<ary.length;i++)
{
path.push(ary[i]);

}
poly1.setPath(path);




}




google.maps.event.addDomListener(window,'load',initialize);
</script>

谢谢Dr.Molle。这样做很好。