JSON數據中的Google地圖標記-“無法加載資源”

Question

我正在嘗試從Police.uk API（ http://data.police.uk/docs/method/crime-street/ ）加載JSON數據，並在Google地圖上繪制標記。 但是，控制台說它無法加載資源。 誰能發現我的錯誤所在？ 隨函附上我的代碼供您審核。 謝謝。

<!DOCTYPE html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Geocoding service</title>
<style>
  html, body, #map-canvas {
    height: 100%;
    margin: 0px;
    padding: 0px
  }
  #panel {
    position: absolute;
    top: 5px;
    left: 50%;
    margin-left: -180px;
    z-index: 5;
    background-color: #fff;
    padding: 5px;
    border: 1px solid #999;
  }
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script src="jquery-1.10.2.min.js"></script>
<script>
  var map;
  var latlng;
//Getting the data from the API (http://data.police.uk/docs/method/crime-street/)
function getJSONpoliceuk(callback){
$.getJSON('http://data.police.uk/api/crimes-street/all-crime? lat=51.5600&lng=1.7800&date=2013-01', callback)
}

//Initializing the map
function initialize() {
var coords = [51.5600, 1.7800]
geocoder = new google.maps.Geocoder();
latlng = new google.maps.LatLng(51.5600, 1.7800);
var mapOptions = {
  zoom: 5,
  center: latlng
}
map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);

var marker = new google.maps.Marker({
    position: latlng,
    map:map,
    title: 'home'
})

getJSONpoliceuk(function(data){
    var crimes = data.crimess;
    var crime, latLng
    for(i in crimes) {
        crime = crimes[i];
        latLng = new google.maps.LatLng(crime.latitude, crime.longitude);
        var marker = new google.maps.Marker({
            position:latlng,
            map:map,
            title: crime.name
        })
    }
})
 }
</script>
</head>
<body onload="initialize()">
<div id="map-canvas" style="width: 320px; height: 480px;"></div>
</body>
</html>

Answer 1

使用此JSON調用

//Getting the data from the API (http://data.police.uk/docs/method/crime-street/)
function getJSONpoliceuk(callback){
$.getJSON('http://data.police.uk/api/crimes-street/all-crime?poly=52.268,0.543:52.794,0.238:52.130,0.478&date=2013-01', callback)
}

和以下回調函數

getJSONpoliceuk(function(data) {
    var crime, latLng;

    for(i in data) {
        crime = data[i];
        latLng = new google.maps.LatLng(parseFloat(crime.location.latitude), 
                                        parseFloat(crime.location.longitude));
        var marker = new google.maps.Marker({
            position: latLng,
            map:      map,
            title:    crime.category
        });
    }
});

我在地圖上有標記。

困擾我的是我得到的結果是在wamp服務器和純客戶端上運行html文件。

jsBin的示例

JSON數據中的Google地圖標記-“無法加載資源”

問題描述

1 個解決方案

解決方案1
1 已采納 2014-01-16 19:37:14

JSON數據中的Google地圖標記-“無法加載資源”

問題描述

1 個解決方案

解決方案1 1 已采納 2014-01-16 19:37:14

解決方案1
1 已采納 2014-01-16 19:37:14