尝试从JSON数组在谷歌地图中制作路径 - try to make path in Google maps from JSON array

try to make path in Google maps from JSON array

本文关键字：路径谷歌地图 JSON 数组 | 更新日期: 2024-07-01

我尝试在谷歌地图中制作路径，首先执行一个查询，并将结果作为 Jeson 查询是

SELECT  ST_AsGeoJSON(ST_Transform(geom,4326)) As geom, cost FROM table;

首先，我将坐标作为PHP中的json数组，json数组的代码是

while ($row = pg_fetch_array($result,null, PGSQL_ASSOC)) {
        $row_array['gid'] = $row['gid'];
        $row_array['cost'] = $row['cost'];
        $row_array['coords'] = json_decode($row['geom'], true);
        array_push($json_response,$row_array);
    }

这个数组的结果是这样的

[{"gid":null,"cost":"66.1287777511195","coords":{"type":"LineString","coordinates":[[22.941692442967,40.586863079715],[22.941123079604,40.586455128992]]}},.......,{"gid":null,"cost":"66.0742074916243","coords":{"type":"LineString","coordinates":[[22.942269084347,40.587264319141],[22.941692442967,40.586863079715]]}}]

我尝试在 JavaScript 中推入一个新数组以在 Map 中绘制，但我无法做到来自 Java 脚本的代码是首先将数组从 PHP 带到 JavaScript

     var jsonAr = <?php echo json_encode($json_response); ?>;

然后用这个循环我托盘来制作 LatLng

var pathAr = new Array();
 for(var i = 0; i < jsonAr.length; i++) {
                  var coords = jsonAr[i].coords.coordinates[0];
            for(var j = 0 ; j < coords.length; j++){
                pathAr.push( new google.maps.LatLng(coords[j][1], coords[j][0]));
            }}

如果有人能帮忙。谢谢。

这一行：

var coords = jsonAr[i].coords.coordinates[0];

应该是

var coords = jsonAr[i].coords.coordinates;

一种不同的方法，因为您的数据似乎非常适合与数据层一起使用。

将其转换为 geoJSON：（未测试）：

<?php
   $json_response=array('type'    =>'FeatureCollection',
                        'features'=>array());
   while ($row = pg_fetch_array($result,null, PGSQL_ASSOC)) {
        $json_response['features'][]
          = array('type'=>'Feature',
                  'properties'=>array('gid' => $row['gid'],
                                      'cost'=> $row['cost']
                                     ),
                  'geometry'=>json_decode($row['geom'], true)
                );
    }
?>
var jsonAr = <?php echo json_encode($json_response); ?>;

要画线，只需调用：

//map ist the google.maps.Map-instance
map.data.addGeoJson(jsonAr);

。完成，无需解析jsonAr.

区别：您的方法将绘制一条线，

其中包含jsonAr的每个项目中定义的所有点，而我的方法将为每个项目绘制一条单独的线。