在 JavaScript 中使用 PHP 变量用于 Google 地图多边形

Using PHP variable in javascript for Google Maps polygon

本文关键字：用于 Google 地图 多边形 变量 PHP JavaScript      更新时间：2023-09-26

我正在使用从数据库中提取的一组坐标在谷歌地图上绘制一个多边形。

  • map.php从数据库中提取坐标
  • 脚本.js在文档就绪上创建映射并存储所有映射配置选项

边界坐标字符串示例：

[52.6294414232, 1.28337337354], [52.6294108159, 1.28350410559], [52.6293577844, 1.28347057106], [52.6292373999, 1.28391974753], [52.6293340783, 1.28400089488], [52.6292540937, 1.28429051171], [52.6292088096, 1.28430189851], [52.6291929061, 1.2842268041], [52.6291753654, 1.28421070907], [52.6291251702, 1.28439909373], [52.6289228389, 1.28423612589], [52.6289538563, 1.28409064607], [52.628795581, 1.28396054235], [52.6288674082, 1.28364075593], [52.628946546, 1.28370580721], [52.6289763352, 1.28360457624], [52.6290289574, 1.2836528604], [52.6290693582, 1.28349330243], [52.6291215713, 1.2835563364], [52.6292403179, 1.28316615953],

我知道坐标字符串是有效的，因为当我手动将其输入地图 javascript 时，多边形显示正确。

我将坐标字符串存储在 PHP 变量 $boundary 中，然后尝试将其传递以在 javascript 中使用，并在 map.php 中使用以下内容： 

<script>
var boundary = <?php echo $boundary ?>;
</script>

在脚本中使用console.log(boundary).js在控制台中正确记录坐标字符串 - 这意味着可以从 js 文件访问变量 - 但地图不会绘制多边形和错误"未捕获的无效值错误：在索引 0：不是 LatLng 或 LatLngLiteral：不是对象"。

但是，如果我将所有脚本.js放在map中.php包装在脚本标签中，则<?php echo $boundary ?>，多边形将完美呈现。这表明将变量从PHP传递到javascript是导致问题的原因。

我尝试使用清洁输出 

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

但没有成功。

任何人都可以建议一种传递此坐标字符串的方法，该方法将在地图javascript中正确呈现？

必须先将数字对转换为google.maps.LatLng 的，然后才能将boundary数字对分配给映射的 path -属性。

var boundary = <?php echo $boundary; ?>;
for(var i = 0; i < boundary.length; ++i ){
  boundary[i] = new google.maps.LatLng(boundary[i][0], 
                                       boundary[i][1]);
}
new google.maps.Polygon({path:boundary/*,more properties*/});
尝试在

相关文章：