我正在尝试使用Google Maps API显示许多多个地图标记,数据位于外部JSON文件中的一系列数组中。
相关HTML / Javascript片段
<div id="map_canvas" style="width:100%; height:100%"></div>
<script type="text/javascript" src="https://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
var map;
function initialize() {
var mapOptions = {
center: new google.maps.LatLng(40.8039941, -77.863459),
zoom: 14,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"),
mapOptions);
}
//get JSON data
$(document).ready(function() {
$.getJSON("crime_maps_test.json", function(json1) {
$.each(json1, function(key, data) {
var latLng = new google.maps.LatLng(data.lat, data.lng);
// Creating a marker and putting it on the map
var marker = new google.maps.Marker({
position: latLng,
title: data.Incident
});
marker.setMap(map);
});
});
});
</script>
<script type="text/javascript"
src="https://maps.googleapis.com/maps/api/js?key=API_key&callback=initialize"></script>
crime_maps_test.json片段(实际文件包含几百个数组)
[
{
"Incident": "PSU201701139"
,"Occurred": "3/25/17 23:25"
,"reported": "3/25/17 23:25"
,"nature of incident": "Resident Assistant reported the odor of marijuana, origin not located"
,"offenses": "Possession of Small Amount of Marijuana"
,"location": "Porter Hall"
,"disposition": "Open"
,"lat": 40.8008254
,"lng": -77.8587917
},
{
"Incident": "PSU201701136"
,"Occurred": "03/25/2017 9:25 PM to 9:30 PM"
,"reported": "3/25/17 21:31"
,"nature of incident": "Visitor observed highly intoxicated"
,"offenses": "Public Drunkenness"
,"location": "Bryce Jordan Center"
,"disposition": "Open"
,"lat": 40.8086228
,"lng": -77.8642905
},
{
"Incident": "PSU201701134"
,"Occurred": "03/25/2017 8:52 PM to 8:58 PM"
,"reported": "3/25/17 20:58"
,"nature of incident": "Resident Assistant reported the odor of marijuana, origin not located"
,"offenses": "Possession of Small Amount of Marijuana"
,"location": "Curtin Hall 5Th Floor"
,"disposition": "Open"
,"lat": 40.8051407
,"lng": -77.8633569
}
]
我在GitHub上托管项目以避免交叉引用错误。当地图显示且开发人员的工具控制台未记录任何错误时,标记不会显示。我在代码中遗漏了一些阻止标记显示的内容吗?任何人都知道这个问题是什么或可能导致什么?
答案 0 :(得分:0)
原来有几个JSON条目存在问题。应该验证数据。