Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/templates/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 标记不会从url json数据中显示_Javascript_Jquery_Json_Google Maps_Google Maps Api 3 - Fatal编程技术网

Javascript 标记不会从url json数据中显示

Javascript 标记不会从url json数据中显示,javascript,jquery,json,google-maps,google-maps-api-3,Javascript,Jquery,Json,Google Maps,Google Maps Api 3,我有一个从api获取数据的地图,叫做police.uk。它通过在地图上拖放一个点来获取数据,并显示1英里半径范围内的犯罪情况。现在我尝试从用户那里获取邮政编码(地理编码)并加载该区域的数据。没有地理编码字段,我不会得到任何错误,但是使用地理编码服务,它无法加载url资源。 这是我的密码。问题在于功能geocodeCrimeLocation。如果有点长,我很抱歉。我只是想弄清楚我在实施什么 <script src="https://maps.googleapis.com/maps/a

我有一个从api获取数据的地图,叫做police.uk。它通过在地图上拖放一个点来获取数据,并显示1英里半径范围内的犯罪情况。现在我尝试从用户那里获取邮政编码(地理编码)并加载该区域的数据。没有地理编码字段,我不会得到任何错误,但是使用地理编码服务,它无法加载url资源。 这是我的密码。问题在于功能geocodeCrimeLocation。如果有点长,我很抱歉。我只是想弄清楚我在实施什么

    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> <!-- jQuery CDN -->
<script>
    var geocoder;
    var map;
    var latlng;
    var markers = [];
    var myPositionMarker = null;;
      //Initializing the map
      function initialize() {
        var lat = 52.629729;
        var lng = -1.131592;
        geocoder = new google.maps.Geocoder();
        latlng = new google.maps.LatLng(lat, lng);
        var mapOptions = {
            zoom: 8,
            center: latlng
        }
        map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
        getCrimeByLocation(lat, lng);
      }

        function fitBoundsMap(){
            //Zoom and center the map to fit the markers  
            //This logic could be conbined with the marker creation.  
            //Just keeping it separate for code clarity.  
            var bounds = new google.maps.LatLngBounds();  
            for (index in markers) {  
                var data = markers[index];
                bounds.extend(data.position);  
            }  
            map.fitBounds(bounds);
        }
        function addMyPositionMarker(lat, lng) {
            if(myPositionMarker != null){
                myPositionMarker.setMap(null); // clearing prev req position
            }

            myPositionMarker = new google.maps.Marker({
                position: new google.maps.LatLng(lat, lng),
                map: map,
                draggable: true,
                zIndex: 99999,
                icon: 'http://i.stack.imgur.com/orZ4x.png'
            });

            google.maps.event.addListener(myPositionMarker,'dragend',function(event) {
                getCrimeByLocation(event.latLng.lat(), event.latLng.lng());
            });
        }
        //Calling the JSON data from the website
        function getCrimeByLocation(lat, lng, date){
            if(date == null){
                var d = new Date();
                date = d.getFullYear() + '-' + (d.getMonth()+1);
                //hardcoding as of now as jan 2014 data is not there, remove when req
                date = "2013-01";
            }
            $.getJSON( "http://data.police.uk/api/crimes-street/all-crime?lat="+lat+"&lng="+lng+"&date="+date, function( data ) {
            while(markers.length > 0){
                markers.pop().setMap(null);
            }

            //marking the requested position
            addMyPositionMarker(lat, lng);

            $.each( data, function( key, val ) {
            //var myLatlng = new google.maps.LatLng(val.location.latitude, val.location.longitude);
                var marker = new google.maps.Marker({
                position: new google.maps.LatLng(val.location.latitude, val.location.longitude),
                map: map,
                animation: google.maps.Animation.DROP,
                draggable: false,
                title: val.location.street.name
                });
                markers.push(marker); // saving markers for reference, so that we can remove them later;
            });

            if(markers.length > 0){
                fitBoundsMap();
            }
            });
        }

function geocodeCrimeLocation(date){
  var address = document.getElementById('address').value;
  geocoder.geocode( { 'address': address}, function(results, status) {
     if (status == google.maps.GeocoderStatus.OK) {
         map.setCenter(results[0].geometry.location);
         var latitude = json.results[0].geometry.location.lat;
         var longitude = json.results[0].geometry.location.lng;

         if(date == null){
            var d = new Date();
            date = d.getFullYear() + '-' + (d.getMonth()+1);
            date = "2013-01";
         }
    $.getJSON( "http://data.police.uk/api/crimes-street/all-crime?   lat="+latitude+"&lng="+longitude+"&date="+date, function(data) {
    while(markers.length > 0){
          markers.pop().setMap(null);
    }

//marking the requested position
addMyPositionMarker(latitude, longitude);

$.each( data, function( key, val ) {
    //var myLatlng = new google.maps.LatLng(val.location.latitude, val.location.longitude);
    var marker = new google.maps.Marker({
        position: new google.maps.LatLng(val.location.latitude, val.location.longitude),
        map: map,
        animation: google.maps.Animation.DROP,
        draggable: false,
        title: val.location.street.name
    });
    markers.push(marker); // saving markers for reference, so that we can remove them later;
    });

if(markers.length > 0){
    fitBoundsMap();
}
});

} else {
     alert('Geocode was not successful for the following reason: ' + status);
}
});
}
</script>

var地理编码器;
var映射;
var latlng;
var标记=[];
var myPositionMarker=null;;
//初始化地图
函数初始化(){
var lat=52.629729;
液化天然气风险值=-1.131592;
geocoder=新的google.maps.geocoder();
latlng=新的google.maps.latlng(lat,lng);
变量映射选项={
缩放:8,
中心:拉丁
}
map=new google.maps.map(document.getElementById(“地图画布”),mapOptions);
getCrimeByLocation(lat、lng);
}
函数fitbundsmap(){
//缩放地图并使其居中以适合标记
//这种逻辑可以与标记创建相结合。
//只是为了代码清晰而将其分开。
var bounds=new google.maps.LatLngBounds();
对于(标记中的索引){
var数据=标记[指数];
扩展(数据位置);
}  
映射边界(bounds);
}
功能添加MyPositionMarker(lat、lng){
如果(myPositionMarker!=null){
myPositionMarker.setMap(null);//清除上一个请求位置
}
myPositionMarker=新建google.maps.Marker({
位置:新google.maps.LatLng(lat,lng),
地图:地图,
真的,
zIndex:99999,
图标:'http://i.stack.imgur.com/orZ4x.png'
});
google.maps.event.addListener(myPositionMarker,'dragend',函数(event){
getCrimeByLocation(event.latLng.lat(),event.latLng.lng());
});
}
//从网站调用JSON数据
函数getCrimeByLocation(lat、lng、日期){
如果(日期==null){
var d=新日期();
日期=d.getFullYear()+'-'+(d.getMonth()+1);
//截至2014年1月的硬编码数据不存在,请在需要时删除
日期=“2013-01”;
}
$.getJSON(“http://data.police.uk/api/crimes-street/all-crime?lat=“+lat+”&lng=“+lng+”&date=“+日期,功能(数据){
while(markers.length>0){
markers.pop().setMap(null);
}
//标记请求的位置
添加我的位置标记(lat、lng);
$。每个(数据、函数(键、值){
//var mylatng=new google.maps.LatLng(val.location.latitude,val.location.longitude);
var marker=new google.maps.marker({
位置:新的google.maps.LatLng(val.location.latitude,val.location.longitude),
地图:地图,
动画:google.maps.animation.DROP,
可拖动:错误,
标题:val.location.street.name
});
markers.push(marker);//保存标记以供参考,以便以后删除它们;
});
如果(markers.length>0){
fitbundsmap();
}
});
}
功能geocodeCrimeLocation(日期){
var address=document.getElementById('address')。值;
geocoder.geocode({'address':address},函数(结果,状态){
if(status==google.maps.GeocoderStatus.OK){
map.setCenter(结果[0].geometry.location);
var latitude=json.results[0].geometry.location.lat;
var longitude=json.results[0].geometry.location.lng;
如果(日期==null){
var d=新日期();
日期=d.getFullYear()+'-'+(d.getMonth()+1);
日期=“2013-01”;
}
$.getJSON(“http://data.police.uk/api/crimes-street/all-crime?   lat=“+纬度+”&lng=“+经度+”&date=“+日期,函数(数据){
while(markers.length>0){
markers.pop().setMap(null);
}
//标记请求的位置
addMyPositionMarker(纬度、经度);
$。每个(数据、函数(键、值){
//var mylatng=new google.maps.LatLng(val.location.latitude,val.location.longitude);
var marker=new google.maps.marker({
位置:新的google.maps.LatLng(val.location.latitude,val.location.longitude),
地图:地图,
动画:google.maps.animation.DROP,
可拖动:错误,
标题:val.location.street.name
});
markers.push(marker);//保存标记以供参考,以便以后删除它们;
});
如果(markers.length>0){
fitbundsmap();
}
});
}否则{
警报('地理编码因以下原因未成功:'+状态);
}
});
}
HTML:


如果有人能提出解决错误的建议,我们将不胜感激。感谢这些代码行(从地理编码器获取位置):


你需要json吗?我不明白你为什么会这样做,除非我是稠密的,因为对象结果被传递到函数中,而你设置了对象的中心,我认为它在工作

您应该会在上看到明显的javascript错误

     var latitude = json.results[0].geometry.location.lat;
     var longitude = json.results[0].geometry.location.lng;
这应该是:

     map.setCenter(results[0].geometry.location);
     var latitude = results[0].geometry.location.lat();
     var longitude = results[0].geometry.location.lng();

结果[0]。geometry.location是一个

,您用于纬度和经度的值是否可能被视为字符串,因为它们来自JSON?当您将它们传递给新的google.maps.LatLng()时,您可能想尝试将它们包装在
parseFloat(…)
中,谢谢您的回复。你是说
var
     var latitude = json.results[0].geometry.location.lat;
     var longitude = json.results[0].geometry.location.lng;
     map.setCenter(results[0].geometry.location);
     var latitude = results[0].geometry.location.lat();
     var longitude = results[0].geometry.location.lng();