在谷歌地图中从纬度经度创建折线?

时间:2012-06-27 07:21:44

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

我正在尝试从google maps v3 api创建折线。我知道如何在点击时添加折线,但我想从纬度和&创建折线循环中的经度值。我怎么能这样做?

    var network_url = decodeURIComponent(document.URL);
    //var network_url = " http://testNetwork.com?param[]=(12.983147333223707, 77.49687217431642)&param[]=(12.95035965289418, 77.54871391015627)";

    var location_array = split_url(network_url);
    for(var i = 0; i<location_array.length; i++)
    {

         //(12.960062579720846,%2077.48313926416017)
        var loc = location_array[i] ; //==>(12.77,  24.87)

        var split_arr1 = loc.split("(");
        var result_split_arr1 = split_arr1[1].split( ")" );

        var split_latLon = result_split_arr1[0];
        var result_split = split_latLon.split(",");

        var split_lat = result_split[0];
        var split_lon = result_split[1];

        marker = new google.maps.Marker({
        position: new google.maps.LatLng(split_lat, split_lon),
        map: map
        });



        ///////////POLYLINE DRAWing /////////////////////////////

        /////////////END OF POLYLINE ////////////////////


     }


}
谢谢。

1 个答案:

答案 0 :(得分:1)

查看折线的文档。它需要一系列LatLng。

循环遍历你的点,将它们抛出一个数组,然后通过构造函数或.setPath()将它们传递给PolyLine。

https://developers.google.com/maps/documentation/javascript/reference#Polyline

编辑:示例。 (我没有运行它。)

    var location_array = split_url(network_url);
    var path = [];
    for(var i = 0; i<location_array.length; i++)
    {

         //(12.960062579720846,%2077.48313926416017)
        var loc = location_array[i] ; //==>(12.77,  24.87)

        var split_arr1 = loc.split("(");
        var result_split_arr1 = split_arr1[1].split( ")" );

        var split_latLon = result_split_arr1[0];
        var result_split = split_latLon.split(",");

        var split_lat = result_split[0];
        var split_lon = result_split[1];
        var latLng = new google.maps.LatLng(split_lat, split_lon);
        path.push(latLng)
        marker = new google.maps.Marker({
        position: latLng,
        map: map
        });

     }

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

}