Question

尝试使用来自DB的PHP从JSON输出的Google Maps API V3绘制多个标记。

地图已在页面上初始化，但不会填充标记。浏览器警告＆＃34;资源解释为其他，但转移时MIME类型未定义。＆＃34;？

请进一步排除故障/调试的建议。

        <!--  load points from database into Locations JSON -->
    $(document).ready(function () {
        $.getJSON("map-service.php?action=listpoints", function(json) {

        if (json.Locations.length > 0) {
            for (i=0; i<json.Locations.length; i++) {
                var location = json.Locations[i];
                    addMarker(location); 
                    }
                }
            });

        function addMarker(location) {
            var point = new google.maps.LatLng(location.lat, location.lng); 
            var marker = new google.maps.Marker({
                position:point,
                map: map,
                title: location.name
                }); 
            };


    });

来自map-service.php？action = listpoints

的验证样本JSON输出

{"Locations":[{"name":"Abco Mountain","lat":"49.424999","lng":"-125.855003"},{"name":"Adder Peak","lat":"49.248333","lng":"-125.320000"},{"name":"Alexandra Peak","lat":"49.738110","lng":"-125.489998"},{"name":"Argus Mountain","lat":"49.538612","lng":"-125.389999"},{"name":"Big Baldy Mountain","lat":"49.759998","lng":"-126.129997"}]}

Answer 1

我的问题源于我如何初始化原始地图对象。它在我分享的代码中不可见......道歉。

我这样做了：

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

并且应该这样做：

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

我在这篇文章中找到了解决方案Adding markers after map created谢谢@yitwail！

Answer 2

尝试使用jquery $ .each进行循环。

if（json＆amp;＆amp; json.Locations）{

$。each（json.Locations，function（）{ addMarker（本）; }）;

}）;

另外，你可能想在addMarker函数中的lat和longiture上调用parseFloat。

从JSON渲染多个Google Maps API V3标记

2 个答案: