Javascript 谷歌地图热图api,无法填充热图
我正在尝试创建一个层热图,如下面的示例所示 我的javascript代码如下所示:Javascript 谷歌地图热图api,无法填充热图,javascript,google-maps,Javascript,Google Maps,我正在尝试创建一个层热图,如下面的示例所示 我的javascript代码如下所示: var map, pointarray, heatmap; function initialize() { var mapOptions = { zoom : 13, center : new google.maps.LatLng(37.774546, -122.433523), mapTypeId : google.maps.MapTypeId.SAT
var map, pointarray, heatmap;
function initialize() {
var mapOptions = {
zoom : 13,
center : new google.maps.LatLng(37.774546, -122.433523),
mapTypeId : google.maps.MapTypeId.SATELLITE
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
heatmap = new google.maps.visualization.HeatmapLayer({
data : []
});
heatmap.setMap(map);
heatmap.setMap(null);
var jsonArray = [];
$.ajax({
url : "/heatmapdata",
type : "GET",
data : "",
contentType : "application/json; charset=utf-8",
dataType : "json",
success : function(data) {
$.each(data, function(i, jsondata) {
var jsonObject = {};
jsonObject.xcoord = jsondata.xcoord;
jsonObject.ycoord = jsondata.ycoord;
jsonArray.push(new google.maps.LatLng(jsonObject.ycoord,
jsonObject.xcoord));
});
var pointArray = new google.maps.MVCArray(jsonArray);
heatmap.setData(pointArray);
heatmap.setMap(map);
}
});
}
google.maps.event.addDomListener(window, 'load', initialize);
来自url的数据具有以下模式:
[
{"ycoord":-122.445368,"xcoord":37.782551},
{"ycoord":-122.444586,"xcoord":37.782745},
{"ycoord":-122.442815,"xcoord":37.782919},
{"ycoord":-122.443688,"xcoord":37.782842}
]
我无法理解我在这里遗漏了什么。控制台显示返回了jsonobject。任何帮助都将不胜感激
问候,,
你的纬度和经度是相反的。“ycoord”值显然是经度(
{“ycoord”:-122.445368,“xcoord”:37.782551}
,允许的纬度范围为+/-90)
代码段:
var图、点阵列、热图;
函数初始化(){
变量映射选项={
缩放:13,
中心:新google.maps.LatLng(37.774546,-122.433523),
mapTypeId:google.maps.mapTypeId.SATELLITE
};
map=new google.maps.map(document.getElementById('map-canvas'),
地图选项);
heatmap=新建google.maps.visualization.HeatmapLayer({
数据:[]
});
热图.设置图(map);
heatmap.setMap(空);
var jsonArray=[];
风险值数据=[{
“ycoord”:-122.445368,
“xcoord”:37.782551
},
{
“ycoord”:-122.444586,
“xcoord”:37.782745
},
{
“ycoord”:-122.442815,
“xcoord”:37.782919
},
{
“ycoord”:-122.443688,
“xcoord”:37.782842
}
];
/*$.ajax({
url:“/heatmapdata”,
键入:“获取”,
数据:“,
contentType:“应用程序/json;字符集=utf-8”,
数据类型:“json”,
成功:函数(数据){*/
$.each(数据、函数(i、jsondata){
var jsonObject={};
jsonObject.xcoord=jsondata.xcoord;
jsonObject.ycoord=jsondata.ycoord;
push(新的google.maps.LatLng(jsonObject.xcoord,jsonObject.ycoord));
});
var pointArray=new google.maps.MVCArray(jsonArray);
heatmap.setData(点阵列);
热图.设置图(map);
/* }
}); */
}
google.maps.event.addDomListener(窗口“加载”,初始化)代码>
html,
身体,
#地图画布{
身高:100%;
宽度:100%;
边际:0px;
填充:0px
}
$.ajax({
url : "/heatmapdata",
type : "GET",
data : "",
contentType : "application/json; charset=utf-8",
dataType : "json",
success : function(data) {
$.each(data, function(i, jsondata) {
var jsonObject = {};
jsonObject.xcoord = jsondata.xcoord;
jsonObject.ycoord = jsondata.ycoord;
jsonArray.push(new google.maps.LatLng(jsonObject.xcoord,
jsonObject.ycoord)); // reverse entries
});
var pointArray = new google.maps.MVCArray(jsonArray);
heatmap.setData(pointArray);
heatmap.setMap(map);
}
});