在谷歌地图 API v3 上显示 json 输出答案

【问题标题】：showing json output on google map API v3在谷歌地图 API v3 上显示 json 输出
【发布时间】：2011-06-24 08:16:42
【问题描述】：

我有一个 json 输出，可以正确显示我的信息，但我很难让它在我的数据库中的每对 lat+lng 上显示一个图标

这是我当前的代码

<?php

require('inc/db.inc.php');
mysql_connect($connect, $user, $pword) or die(mysql_error());
mysql_select_db($db) or die(mysql_error());

$sql=mysql_query("SELECT store_lat,store_long FROM location WHERE status='Active'");
while($row=mysql_fetch_assoc($sql))
$output[]=$row;
$locations=(json_encode($output));

?>
<script src="http://maps.google.com/maps/api/js?sensor=false&amp;key=MY_API_KEY" type="text/javascript"></script>
<script type="text/javascript"> 
function initialize() {

    var image = 'images/icon.png';
    var myLatlng = new google.maps.LatLng(42.548625, -92.548765);

    var myOptions = {
        zoom: 4,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
        }

    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    var poiJson = <? echo $locations ?>;
    for (var i = 0;i < poiJson.length; i += 1) {
        var lat = poiJson[i].store_lat;
        var lng = poiJson[i].store_long;
        addMarker(lat,lng,i);
        };
}

function addMarker(lat,lng,no){
    var latlng = new google.maps.LatLng(lat,lng);
    var marker = new google.maps.Marker({
        position: latlng,
        map: map
        // if i uncomment the icon line no map will show at all
        //icon: image
        });
}
</script> 

<? include "header.php"; ?>
<p>
<table width="1024">
<tr>
  <td align="center" valign="top"><div id="map_canvas" style="width: 95%; height: 600px;"></div></td>
</tr>
</table>
</p>
</body> 
</html>

编辑

如果我将图像更改为 addMarker 函数，这不会改变任何内容。

<script type="text/javascript"> 
function initialize() {


    var myLatlng = new google.maps.LatLng(42.548625, -92.548765);

    var myOptions = {
        zoom: 4,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
        }

    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    var poiJson = <? echo $locations ?>;
    for (var i = 0;i < poiJson.length; i += 1) {
        var lat = poiJson[i].store_lat;
        var lng = poiJson[i].store_long;
        addMarker(lat,lng,i);
        };
}

function addMarker(lat,lng,no){
    var image = 'images/icon.png';
    var latlng = new google.maps.LatLng(lat,lng);
    var marker = new google.maps.Marker({
        position: latlng,
        map: map
        //icon: image
        });
}
</script>

【问题讨论】：

有趣。我昨晚刚写了一个脚本，它完全符合您的要求。确认 JSON 输出是您想要的。还可以尝试记录对addMarker 的调用，以确保正确解析所有数据。
我能够让它在使用相同 json 输出的 android 应用程序上工作，所以我不认为 json 输出是问题。我以前对 JS 做的不多。我怎样才能得到一些错误，以便我知道我的代码发生了什么？
如果查看源代码，这就是 json 的显示方式var poiJson = [{"store_lat":"42968605","store_long":"-81282452"},{"store_lat":"42954525","store_long":"-81289456"}]; for (var i = 0;i < poiJson.length; i += 1) { 我的 json 输出中有大约 4000 个项目。
JSON 看起来不错。您是否尝试在创建新的 LatLng 实例时记录您的参数？

标签： php json google-maps-api-3

【解决方案1】：

在addMarker 的范围内没有定义image（因此会出现错误）。它只是initialize 的本地。要么在addMarker 中定义它，要么让它成为全局的。

【讨论】：

我通过将var image 移动到function addMarker 进行了上面的编辑，没有任何变化。
@PsychoDogg：你也取消了图标行的注释吗？路径是否正确？
是的，一切都很好，我认为这与未添加 lat 和 lng 有关。