使用 PHP foreach 循环的 javascript 中的 MySQL 数据（Google Maps API）

Posted 2023-02-24

【中文标题】使用 PHP foreach 循环的 javascript 中的 MySQL 数据（Google Maps API）

【英文标题】：MySQL data in javascript using PHP's foreach loop (Googlel Maps API)

【发布时间】：2011-08-23 00:00:08

【问题描述】：

我正在尝试使用 Google Maps V3 API 在 Google 地图上创建标记。我在 mysql 数据库中有标记的坐标，目前在我的 .php 文件中的 PHP 数组中。现在如何使用 foreach() 循环（或其他合适的方法）循环遍历我的 PHP 数组中的元素并在每次循环迭代时创建一个新的谷歌地图标记？

PS：我的 PHP 不错，但不是我的 javscript 知识。我现在关注的关于创建标记的教程位于http://www.svennerberg.com/2009/07/google-maps-api-3-markers/

代码

我正在使用 Codeigniter 框架，因此控制器+模型文件已经将必要的数据（名称、lng、lat...）检索到数组 $map 中。我可以使用通常的方法循环数组：

foreach($map as $row) 
    $lng = $row[lng]  // this is not necessary, its just to show what is in the array
    $lat = $row[lat]
    // now how do I use this loop to create new marker code in javascript?

用于创建每次 foreach 循环迭代必须创建一次的谷歌地图标记的 JS 代码如下：

var map = new google.maps.Map(document.getElementById('map'),   
zoom: 7,  
  center: new google.maps.LatLng($lng, $lat),    // how do i pass the PHP variables into the JS code?  
  mapTypeId: google.maps.MapTypeId.ROADMAP  
);

所以我的问题是我如何传递 PHP 数组中的 PHP 变量来创建上面的 JS 代码，每次 foreach() 循环迭代一次？

【问题讨论】：

显示您目前拥有的一些代码，以便我们为您提供帮助

在原帖中添加了一些代码...

【参考方案1】：

首先，您走在正确的轨道上，但您只需要了解服务器端语言和客户端语言的不同概念以及它们如何交互即可。 PHP 不会将变量“传递”给 JavaScript，但它所做的是生成您想要的任何 html 文档。

然后，该 HTML 文档可以包含 JavaScript，该 JavaScript 将在页面由浏览器呈现时执行。因此，将您的 PHP 视为 制作 JavaScript 代码：

PHP在HTML页面中输出JavaScript代码示例：

<script type="text/javascript">
     var testval = "<?php echo "Hello, " . (5 + 3) . "!" ?>";  // "Hello, 8!
</script>

现在，我查看了教程，实际上您问题中的代码不是正确的代码 - 而是创建地图的代码，您示例中的 lat/long 参数用于中心，而不是标记。

因此，在您的 PHP 页面中，您需要执行以下操作：

某处，你需要创建地图：var map = new google.maps.Map...（如教程所示） 接下来，获取包含'lng' 和'lat' 键的数组项的$map 数组。 （注意：您应该始终将数组键名用引号括起来） 在打开的脚本标签中使用<?php 创建一个PHP 代码块，并创建您的foreach 循环。为每个项目创建创建标记所需的 JavaScript 代码。

foreach 循环示例：

<script type="text/javascript">
<?php
foreach($map as $row) 
    $lng = $row['lng'];
    $lat = $row['lat'];
    ?>
    // Creating a marker and positioning it on the map  
    new google.maps.Marker(  
        position: new google.maps.LatLng(<?php echo $lat ?>, <?php echo $lng; ?>),  
        map: map  
    ); 
    <?php

?>
</script>

【参考方案2】：

通常这里的方法是将 PHP 数据编码为 JSON，然后将其回显到 Javascript 变量中：

<script type="text/javascript">
var myData = <?php echo json_encode($map); ?>;
</script>

这将输出一个 Javascript 文字，您可以在客户端脚本中使用。

【参考方案3】：

你会想要循环这个：

var marker;

<?php foreach($map as $row) ?>
  marker = new google.maps.Marker(  
  position: new google.maps.LatLng(<?php echo $row['lat'].','.$row['long']; ?>),  
  map: map  
);
<?php  ?>

就在您包含的其他代码之后（最初用于设置地图）。

【参考方案4】：

example to loop in JavaScript is as follows-

<script type="text/javascript">
"<?php echo $arr=array('1'=>'1','2'=>'2','3'=>'3','4'=>'4','5'=>'5'); 
foreach($arr as $k => $v) ?>"
var x='<?php echo $v; ?>';
alert(x);
"<?php  ?>"
</script> 

Replace $arr with your array and apply google map code in the script.

【参考方案5】：

正如@nrabinowitz 所说，您可以在 ajax 请求中添加代码

如果您的 javascript 在加载的同一页面中，您可以将其添加到同一页面中。

<?php $c = 0;// counter ?>
<?php foreach ($map as $row):?>
var marker<?php echo $c?> = new google.maps.Marker(
     position: new google.maps.LatLng(<?php echo $row['lat'].','.$row['long']; ?>),     map: map   );
<?php $c++; ?>
<?php endforeach;?>

这样你就不会覆盖变量