1

我正在使用 json 文件中的标记创建地图,我的问题是我无法让标记显示在地图上。我可以链接一个基本的 json 文件,但是当我尝试使用数组文件时,我没有得到任何标记。我的代码是:

    <script src="js/mapping.js"></script>
    <script type="text/javascript">
    (function () {

window.onload = function () {

    // Creating a new map
    var map = new google.maps.Map(document.getElementById("map"), {
            center : new google.maps.LatLng(51.50746, -0.127594),
            zoom : 8,
            mapTypeId : google.maps.MapTypeId.ROADMAP
            });



            // Creating a global infoBox object that will be reused by all markers
    infoBubble = new InfoBubble({
      minWidth: 300,
      maxWidth: 400,
      minHeight: 300,
      maxHeight: 400,
      arrowSize: 50,
      arrowPosition: 50,
      arrowStyle: 2,
      borderRadius: 0,
      shadowStyle: 1,
    }); // end Creating a global infoBox object

    // Creating a global infoBox object tabs
    infoBubble.addTab('Details');
    infoBubble.addTab('Info');
    // end Creating a global infoBox object tabs        

    // Custom Markers
    var markers = {};
      var categoryIcons = {
        1 : "images/liver_marker1.png",
        2 : "images/liver_marker2.png",
        3 : "images/liver_marker3.png",
        4 : "images/liver_marker4.png",
        5 : "images/liver_marker.png",
        6 : "images/liver_marker6.png",
        7 : "images/liver_marker.png"
      } // end Custom Markers

    // Looping through the JSON data
    for (var i = 0, length = json.length; i < length; i++) {
        var data = json[i],
        latLng = new google.maps.LatLng(data.Latitude, data.Longitude);


        // Creating a marker and putting it on the map
        var marker = new google.maps.Marker({
                position : latLng,
                map : map,
                title : data.title,
                icon : categoryIcons[data.category]
            });

        // Creating a closure to retain the correct data, notice how I pass the current data in the loop into the closure (marker, data)
        (function (marker, data) {

            // Attaching a click event to the current marker
            google.maps.event.addListener(marker, 'click', function(e) {
                //infoBubble.setContent('<b>'+data.description+'</b>'+'<br>'+data.name);
                infoBubble.updateTab(0, 'Details', data.deviceOwnerName);
                infoBubble.updateTab(1, 'Info', data.name);
                infoBubble.open(map, marker);
                map.panTo(loc);
}); // end Attaching a click event to the current marker

        })(marker, data); // end Creating a closure

    } // end Looping through the JSON data

}

})();
google.maps.event.addDomListener(window, 'load', initialize);
</script>

我的 json 数组文件是:

    {
"Device" : [{
        "DeviceId" : "e889",
        "DeviceRef" : "Te889",
        "DeviceName" : null,
        "DeviceText" : "Operated by SE",
        "DeviceLocation" : {
            "Latitude" : "51.484804",
            "Longitude" : "-0.103226",
            "Address" : {
                "SubBuildingName" : null,
                "BuildingName" : null,
                "BuildingNumber" : null,
                "Thoroughfare" : null,
                "Street" : "Volcan Road North",
                "DoubleDependantLocality" : null,
                "DependantLocality" : null,
                "PostTown" : "Norwich",
                "PostCode" : "NR6 6AQ",
                "Country" : "gb"
            },
            "LocationShortDescription" : null,
            "LocationLongDescription" : null
        },
        "Connector" : [{
                "ConnectorId" : "JEV01",
                "ConnectorType" : "JEVS G 105 (CHAdeMO)",
                "RatedOutputkW" : "50.00",
                "RatedOutputVoltage" : null,
                "RatedOutputCurrent" : null,
                "ChargeMethod" : "DC",
                "ChargeMode" : "1",
                "ChargePointStatus" : "In service",
                "TetheredCable" : "0",
                "Information" : null
            }
        ],
        "Controller" : {
            "OrganisationName" : "SE",
            "Website" :  null,
            "TelephoneNo" :  null,
            "ContactName" : null
        },
        "DeviceOwner" : {
            "OrganisationName" : "Unknown",
            "Website" : null,
            "TelephoneNo" : null,
            "ContactName" : null
        },
        "DeviceAccess" : {
            "RegularOpenings" : [{
                    "Days" : "Monday",
                    "Hours" : {
                        "From" : "08:00",
                        "To" : "18:00"
                    }
                }, {
                    "Days" : "Tuesday",
                    "Hours" : {
                        "From" : "08:00",
                        "To" : "18:00"
                    }
                }, {
                    "Days" : "Wednesday",
                    "Hours" : {
                        "From" : "08:00",
                        "To" : "18:00"
                    }
                }, {
                    "Days" : "Thursday",
                    "Hours" : {
                        "From" : "08:00",
                        "To" : "18:00"
                    }
                }, {
                    "Days" : "Friday",
                    "Hours" : {
                        "From" : "08:00",
                        "To" : "18:00"
                    }
                }, {
                    "Days" : "Saturday",
                    "Hours" : {
                        "From" : "08:30",
                        "To" : "05:00"
                    }
                }
            ],
            "Open24Hours" : true
        },
        "PaymentRequiredFlag" : false,
        "SubscriptionRequiredFlag" : true,
        "Accessible24Hours" : false,
        "PhysicalRestrictionFlag" : false,
        "PhysicalRestrictionText" : null,
        "OnStreetFlag" : false,
        "Bearing" : null
    }
    ]}

我正在尝试链接到纬度和经度,但我也希望显示 DeviceId。

任何帮助,将不胜感激。

R

4

1 回答 1

0

纬度和经度是 JSON 文件中的嵌套成员。如果不先深入研究 DeviceLocation 成员,您将无法访问它们。我建议您阅读这篇文章 ( http://www.w3schools.com/json/ ) 以了解 JSON 的工作原理。

于 2013-04-24T14:47:00.690 回答