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

时间:2011-06-24 08:16:43

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

我有一个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>

1 个答案:

答案 0 :(得分:1)

image范围内没有定义addMarker(因此您会收到错误消息)。它只是本地initialize。在addMarker中定义它或将其设为全局。