使用GPS坐标在谷歌地图中绘制线路路径

4

请问如何在Google-Map上根据从数据库检索到的GPS坐标绘制路径?

我获取的GPS坐标示例如下:

10.013566,76.331549
10.013566,76.331463
10.013503,76.331313
10.013482,76.331205
10.013419,76.330926
10.013334,76.330712
10.013313,76.330411
10.013292,76.330175
10.013228,76.329854
10.013144,76.329553
10.013059,76.329296
10.012996,76.329017
10.012869,76.328802
10.012785,76.328545
10.012700,76.328223
10.012679,76.328030
10.012658,76.327837
10.012637,76.327600
10.012573,76.327322
10.012552,76.327043
10.012552,76.326807
10.012510,76.326613
10.012447,76.326399
10.012404,76.326227
1个回答

8

试试这个

演示

function initialize(){
   var center= new google.maps.LatLng(10.012869,76.328802);
   var myOptions = {
            zoom: 18,
            center: center,
            mapTypeControl: true,
            mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
            navigationControl: true,
            mapTypeId: google.maps.MapTypeId.HYBRID
   }     
  var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

  var polylineCoordinates = [
        new google.maps.LatLng(10.013566,76.331549),
        new google.maps.LatLng(10.013566,76.331463),
        new google.maps.LatLng(10.013503,76.331313),
        new google.maps.LatLng(10.013482,76.331205),
        new google.maps.LatLng(10.013419,76.330926),
        new google.maps.LatLng(10.013334,76.330712),
        new google.maps.LatLng(10.013313,76.330411),
        new google.maps.LatLng(10.013292,76.330175),
        new google.maps.LatLng(10.013228,76.329854),
        new google.maps.LatLng(10.013144,76.329553),
        new google.maps.LatLng(10.013059,76.329296),
        new google.maps.LatLng(10.012996,76.329017),
        new google.maps.LatLng(10.012869,76.328802),
        new google.maps.LatLng(10.012785,76.328545),
        new google.maps.LatLng(10.012700,76.328223),
        new google.maps.LatLng(10.012679,76.328030),
        new google.maps.LatLng(10.012658,76.327837),
        new google.maps.LatLng(10.012637,76.327600),
        new google.maps.LatLng(10.012573,76.327322),
        new google.maps.LatLng(10.012552,76.327043),
        new google.maps.LatLng(10.012552,76.326807),
        new google.maps.LatLng(10.012510,76.326613),
        new google.maps.LatLng(10.012447,76.326399),
        new google.maps.LatLng(10.012404,76.326227),
  ];
  var polyline = new google.maps.Polyline({
      path: polylineCoordinates,
      strokeColor: '#FF0000',
      strokeOpacity: 1.0,
      strokeWeight: 2,
      editable: true
  });

  polyline.setMap(map);    

}



initialize();

根据您的需求设置缩放 - Pragnesh Chauhan
先生,我们可以用这个来生成动态线吗?因为我正在从数据库中获取坐标……这些坐标是由我的Android应用程序更新的。地图是否会随着坐标的移动而移动? - user2040500
我不知道坐标的移动,但你可以将坐标添加到数组中。 - Pragnesh Chauhan
关于外框(用于显示地图的)是否移动? - user2040500

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接