0

我正在使用本地 json 文件在谷歌地图中显示 GeoMap 位置。我可以正确显示地图，但不能正确显示地图中的标记位置。请帮忙

这是我的代码

var json;

$(document).ready(function(){
var map; var infowindow;
 var jsonData = '[{ "id" : "1" , "Lat" : "-36.847043" ,"Lng" :"174.761543"},{ "id" : 
"2" 
  , "Lat" : "-37.791174" ,"Lng" :"175.297813"},{ "id" : "3" ,  "Lat" : "-38.679988" 
 ,"Lng" :"176.077843"},{ "id" : "4" , "Lat" : "-41.297257" ,"Lng" :"174.759483"} ]';
    //alert(jsonData);
     json = $.parseJSON(jsonData);
   });

   function InitializeMap() {
var Lat="-36.847043";
var Lng="174.761543";
    var latlng = new google.maps.LatLng(Lat,Lng);
    var myOptions =
    {
        zoom: 8,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      };
      map = new google.maps.Map(document.getElementById("map"), myOptions);
     }

function markicons() {
   InitializeMap();

var ltlng = [];

alert(json);
console.log(json.Lat);
    for (var i=0; i <=json.length; i++)
    {
    alert(LatLng);
    ltlng.push(new google.maps.LatLng(json[i].Lat, json[i].Lng));
    }


    //ltlng.push(new google.maps.LatLng(-36.847043, 174.761543));
   // ltlng.push(new google.maps.LatLng(-37.791174,175.297813));
   // ltlng.push(new google.maps.LatLng(-38.679988,176.077843));
   // ltlng.push(new google.maps.LatLng(-41.297257,174.759483));

    map.setCenter(ltlng[0]);
    for (var i = 0; i <= ltlng.length; i++) {
        marker = new google.maps.Marker({
            map: map,
            position: ltlng[i]
        });

        (function (i, marker) {

            google.maps.event.addListener(marker, 'click', function () {

                if (!infowindow) {
                    infowindow = new google.maps.InfoWindow();
                }

                infowindow.setContent("Message" + i);

                infowindow.open(map, marker);

            });

        })(i, marker);

    }

}

window.onload = markicons;

这是我控制台时的错误：

未捕获的 ReferenceError：未定义 LatLng

帮助 - 在此先感谢

4

1 回答 1

0

你已经定义了latlng而不是LatLng尝试这样的事情：

for (var i = 0; i <= json.length; i++) {

    ltlng.push(new google.maps.LatLng(json[i].Lat, json[i].Lng));
    alert(ltlng[i]);
}

或者，如果您在警报中需要var latlng = new google.maps.LatLng(Lat,Lng); 此latlng值，则首先您必须更改变量名称并在全局范围内声明 latlng。

尝试这个 ：

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

        var map = new google.maps.Map(document.getElementById("map"), {
                mapTypeId : google.maps.MapTypeId.ROADMAP,
                center : new google.maps.LatLng(-36.847043, 174.761543),
                zoom : 6
            });

        var infowindow = new google.maps.InfoWindow({
                content : "holding..."
            });

        var jsonData = '[{ "id" : "1", "Lat" : "-36.847043", "Lng" :"174.761543"},'
             + '{ "id" : "2", "Lat" : "-37.791174", "Lng" :"175.297813"},'
             + '{ "id" : "3", "Lat" : "-38.679988", "Lng" :"176.077843"},'
             + '{ "id" : "4", "Lat" : "-41.297257", "Lng" :"174.759483"} ]';

        var json = $.parseJSON(jsonData);

        var ltlng = [];

        for (var i = 0; i < json.length; i++) {
            ltlng.push(new google.maps.LatLng(json[i].Lat, json[i].Lng));
        }

        map.setCenter(ltlng[0]);
        for (var i = 0; i < ltlng.length; i++) {
            marker = new google.maps.Marker({
                    map : map,
                    position : ltlng[i]
                });

            (function (i, marker) {

                google.maps.event.addListener(marker, 'click', function () {

                    if (!infowindow) {
                        infowindow = new google.maps.InfoWindow();
                    }

                    infowindow.setContent("Message" + i);

                    infowindow.open(map, marker);

                });

            })(i, marker);
        }
    }

    google.maps.event.addDomListener(window, 'load', markicons);

</script>

网页：

<div id="map" style="width:700px;height:700px;"></div>

演示

于 2013-10-19T12:28:59.410 回答