Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/430.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

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/89.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 GoogleMapsV3只是ajax查询后的一个灰色框_Javascript_Html_Google Maps_Twitter Bootstrap - Fatal编程技术网

Javascript GoogleMapsV3只是ajax查询后的一个灰色框

Javascript GoogleMapsV3只是ajax查询后的一个灰色框,javascript,html,google-maps,twitter-bootstrap,Javascript,Html,Google Maps,Twitter Bootstrap,我最近才开始使用html、javascript、webapps等,我决定尝试编写自己的独立Web服务器 我将Twitter引导用于UI,将jQuery用于javascript。列出所有报告,并允许用户选择一个在地图上查看。然后,页面以JSON的形式从服务器获取数据,一切正常。然而,当我调用map.setCenter(新的google.maps.LatLng(data['lat',data['lng'))时,地图会变成灰色,而不是移动到那个位置 我曾在chrome和firefox中尝试过,但我也遇

我最近才开始使用html、javascript、webapps等,我决定尝试编写自己的独立Web服务器

我将Twitter引导用于UI,将jQuery用于javascript。列出所有报告,并允许用户选择一个在地图上查看。然后,页面以JSON的形式从服务器获取数据,一切正常。然而,当我调用
map.setCenter(新的google.maps.LatLng(data['lat',data['lng'))
时,地图会变成灰色,而不是移动到那个位置

我曾在chrome和firefox中尝试过,但我也遇到了同样的问题。奇怪的是,chrome控制台调试器和firebug中都没有错误。我可以在“类似问题”下看到10个类似的问题;然而,这些解决方案(如CSS)都没有帮助


这是一个网站(它是dotCloud上的一个沙箱,所以速度可能很慢):

所以我注意到你将地图对象存储为
窗口['map']
(有趣的是,每个人似乎都这么做了……当我不必深入到源代码时,调试会更容易:)

我尝试使用一组已知的坐标设置中心:

map.setCenter(new google.maps.LatLng('51.0453246', '-114.0581012'));
这工作正常,因此实际代码工作正常。我测试了一些错误值的案例
null
0
将把我放在海洋的某个地方,但是
未定义的
lat
lng
将使地图变灰。可能您传递的值不正确,最终导致
未定义

查看第二个
警报
,相关属性是
纬度
经度
,尽管您似乎正在传入
数据['lat']
数据['lng']
。这就是原因吗

这应该可以解决这个问题:

//update map
marker = new google.maps.Marker({
    position: new google.maps.LatLng(data['latitude'], data['longitude']),
    title:"Last Known Position"
});
marker.setMap(map);
map.setCenter(new google.maps.LatLng(data['latitude'], data['longitude']))
// google.maps.event.trigger(map, 'resize');

请注意,我注释掉了您的“resize”触发器(我认为您可能是为了解决此问题而添加此触发器的?我记得在这里向其他用户建议过:)。您的情况下不需要它。

好的,我刚刚发现问题。它实际上是服务器端,我没有将响应标记为JSON,所以javascript实际上接收到一个字符串,我试图将其用作JSON对象。对于使用Flask的任何人,以下是执行此操作的代码:
返回响应(json.dumps(report),mimetype='text/json')


现在我真的不知道mark的哪个答案是正确的(两个答案在技术上都是正确的,因为有两个不同的问题)

这太令人恼火了。我认为这实际上是一个额外的问题。发生的事情是,android客户端将数据上传为“lat”和“lng”,我认为这是垃圾,所以我将其更改为服务器端的纬度和经度。现在的问题是,由于某种原因,数据[‘纬度’]没有定义。感谢您的快速回复,虽然我找到了根本原因(请参阅下面的答案),但我将此标记为正确答案,因为根据我的提交消息判断,我可能会放弃并发布另一个问题。很高兴您找到了答案geniass:)您的应用看起来很整洁!它很干净,我喜欢。