Javascript 谷歌热图：未捕获类型错误：“；无法读取属性'；α'；“未定义”的定义；
说明 我正试图根据api查询返回的数据向google地图添加多个热图层。一切似乎都正常工作，但在$ajax.done（）完成后（而不是在期间）会触发错误。我在添加图层后尝试缩放时也注意到了这个错误。新图层不会出现在地图上 错误消息Javascript 谷歌热图：未捕获类型错误：“；无法读取属性'；α'；“未定义”的定义；,javascript,jquery,google-maps,Javascript,Jquery,Google Maps,说明 我正试图根据api查询返回的数据向google地图添加多个热图层。一切似乎都正常工作，但在$ajax.done（）完成后（而不是在期间）会触发错误。我在添加图层后尝试缩放时也注意到了这个错误。新图层不会出现在地图上 错误消息 (function ($) { var map, pointArray, heatmap, dataPoints = [], layers = [], $loader = $('.loader, .loader-overlay'), anima
(function ($) {
var map, pointArray, heatmap, dataPoints = [],
layers = [],
$loader = $('.loader, .loader-overlay'),
animation_speed = 666,
$addLayerBtn = $('.btn.action-addLayer'),
gradients = [{
"0": "rgba(255,255,255,0)",
"0.29": "rgba(148,0,0,1)",
"0.33": "rgba(170,0,0,1)",
"0.37": "rgba(191,0,0,1)",
"0.42": "rgba(212,0,0,1)",
"0.46": "rgba(233,0,0,1)",
"0.50": "rgba(255,0,0,1)",
"0.54": "rgba(255,21,21,1)",
"0.58": "rgba(255,42,42,1)",
"0.62": "rgba(255,63,63,1)",
"0.67": "rgba(255,85,85,1)",
"0.71": "rgba(255,106,106,1)",
"0.75": "rgba(255,127,127,1)",
"0.79": "rgba(255,148,148,1)",
"0.83": "rgba(255,170,170,1)",
"0.87": "rgba(255,191,191,1)",
"0.92": "rgba(255,212,212,1)",
"0.96": "rgba(255,233,233,1)",
"1.00": "rgba(255,255,255,1)"
}, {
"0": "rgba(255,255,255,0)",
"0.29": "rgba(0,0,148,1)",
"0.33": "rgba(0,0,170,1)",
"0.37": "rgba(0,0,191,1)",
"0.42": "rgba(0,0,212,1)",
"0.46": "rgba(0,0,233,1)",
"0.50": "rgba(0,0,255,1)",
"0.54": "rgba(21,21,255,1)",
"0.58": "rgba(42,42,255,1)",
"0.62": "rgba(63,63,255,1)",
"0.67": "rgba(85,85,255,1)",
"0.71": "rgba(106,106,255,1)",
"0.75": "rgba(127,127,255,1)",
"0.79": "rgba(148,148,255,1)",
"0.83": "rgba(170,170,255,1)",
"0.87": "rgba(191,191,255,1)",
"0.92": "rgba(212,212,255,1)",
"0.96": "rgba(233,233,255,1)",
"1.00": "rgba(255,255,255,1)"
}, {
"0": "rgba(255,255,255,0)",
"0.29": "rgba(0,148,148,1)",
"0.33": "rgba(0,170,170,1)",
"0.37": "rgba(0,191,191,1)",
"0.42": "rgba(0,212,212,1)",
"0.46": "rgba(0,233,233,1)",
"0.50": "rgba(0,255,255,1)",
"0.54": "rgba(21,255,255,1)",
"0.58": "rgba(42,255,255,1)",
"0.62": "rgba(63,255,255,1)",
"0.67": "rgba(85,255,255,1)",
"0.71": "rgba(106,255,255,1)",
"0.75": "rgba(127,255,255,1)",
"0.79": "rgba(148,255,255,1)",
"0.83": "rgba(170,255,255,1)",
"0.87": "rgba(191,255,255,1)",
"0.92": "rgba(212,255,255,1)",
"0.96": "rgba(233,255,255,1)",
"1.00": "rgba(255,255,255,1)"
}, {
"0": "rgba(255,255,255,0)",
"0.29": "rgba(0,148,148,1)",
"0.33": "rgba(0,170,170,1)",
"0.37": "rgba(0,191,191,1)",
"0.42": "rgba(0,212,212,1)",
"0.46": "rgba(0,233,233,1)",
"0.50": "rgba(0,255,255,1)",
"0.54": "rgba(21,255,255,1)",
"0.58": "rgba(42,255,255,1)",
"0.62": "rgba(63,255,255,1)",
"0.67": "rgba(85,255,255,1)",
"0.71": "rgba(106,255,255,1)",
"0.75": "rgba(127,255,255,1)",
"0.79": "rgba(148,255,255,1)",
"0.83": "rgba(170,255,255,1)",
"0.87": "rgba(191,255,255,1)",
"0.92": "rgba(212,255,255,1)",
"0.96": "rgba(233,255,255,1)",
"1.00": "rgba(255,255,255,1)"
}, {
"0": "rgba(255,255,255,0)",
"0.29": "rgba(0,148,148,1)",
"0.33": "rgba(0,170,170,1)",
"0.37": "rgba(0,191,191,1)",
"0.42": "rgba(0,212,212,1)",
"0.46": "rgba(0,233,233,1)",
"0.50": "rgba(0,255,255,1)",
"0.54": "rgba(21,255,255,1)",
"0.58": "rgba(42,255,255,1)",
"0.62": "rgba(63,255,255,1)",
"0.67": "rgba(85,255,255,1)",
"0.71": "rgba(106,255,255,1)",
"0.75": "rgba(127,255,255,1)",
"0.79": "rgba(148,255,255,1)",
"0.83": "rgba(170,255,255,1)",
"0.87": "rgba(191,255,255,1)",
"0.92": "rgba(212,255,255,1)",
"0.96": "rgba(233,255,255,1)",
"1.00": "rgba(255,255,255,1)"
}, {
"0": "rgba(255,255,255,0)",
"0.29": "rgba(0,148,148,1)",
"0.33": "rgba(0,170,170,1)",
"0.37": "rgba(0,191,191,1)",
"0.42": "rgba(0,212,212,1)",
"0.46": "rgba(0,233,233,1)",
"0.50": "rgba(0,255,255,1)",
"0.54": "rgba(21,255,255,1)",
"0.58": "rgba(42,255,255,1)",
"0.62": "rgba(63,255,255,1)",
"0.67": "rgba(85,255,255,1)",
"0.71": "rgba(106,255,255,1)",
"0.75": "rgba(127,255,255,1)",
"0.79": "rgba(148,255,255,1)",
"0.83": "rgba(170,255,255,1)",
"0.87": "rgba(191,255,255,1)",
"0.92": "rgba(212,255,255,1)",
"0.96": "rgba(233,255,255,1)",
"1.00": "rgba(255,255,255,1)"
}];
Array.prototype.clean = function (deleteValue) {
for (var i = 0; i < this.length; i++) {
if (this[i] == deleteValue) {
this.splice(i, 1);
i--;
}
}
return this;
};
function initialize() {
var mapOptions = {
zoom: 5,
center: new google.maps.LatLng(39, -95),
mapTypeId: google.maps.MapTypeId.ROADMAP,
suppressInfoWindows: true
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
$addLayerBtn = $('.btn.action-addLayer');
$loader.fadeOut();
}
function addLayer(xxx, yyy, zzz, aaa, bbb) {
var layerTextArray = [],
$layers = $('ul.layers'),
layerId = layers.length,
$layer = $('<li />').addClass('layer').data('layerid', layerId);
$loader.fadeIn(animation_speed);
// ... do some stuff ...
$.ajax({
url: '/API/xxx',
type: 'get',
data: {
v: new Date().getTime(),
xxx: xxx
}
}).done(function (response) { // returns JSON array of objects
$(response).each(function () {
var node = this;
dataPoints.push(new google.maps.LatLng(node.latitude, node.longitude));
});
pointArray = new google.maps.MVCArray(dataPoints);
var heatmap = new google.maps.visualization.HeatmapLayer({
opacity: 0.8,
radius: 20,
data: pointArray,
gradient: gradients[layerId],
map: map
});
layers.push(heatmap);
$loader.fadeOut(animation_speed);
});
}
$addLayerBtn.on('click', function (event) {
var $this = $(this)
//...
;
event.preventDefault();
addLayer(xxx, yyy, zzz, aaa, bbb);
});
google.maps.event.addDomListener(window, 'load', initialize);})(jQuery);
(function ($) {
var map, pointArray, heatmap, dataPoints = [],
layers = [],
$loader = $('.loader, .loader-overlay'),
animation_speed = 666,
$addLayerBtn = $('.btn.action-addLayer'),
gradients = [{
"0": "rgba(255,255,255,0)",
"0.29": "rgba(148,0,0,1)",
"0.33": "rgba(170,0,0,1)",
"0.37": "rgba(191,0,0,1)",
"0.42": "rgba(212,0,0,1)",
"0.46": "rgba(233,0,0,1)",
"0.50": "rgba(255,0,0,1)",
"0.54": "rgba(255,21,21,1)",
"0.58": "rgba(255,42,42,1)",
"0.62": "rgba(255,63,63,1)",
"0.67": "rgba(255,85,85,1)",
"0.71": "rgba(255,106,106,1)",
"0.75": "rgba(255,127,127,1)",
"0.79": "rgba(255,148,148,1)",
"0.83": "rgba(255,170,170,1)",
"0.87": "rgba(255,191,191,1)",
"0.92": "rgba(255,212,212,1)",
"0.96": "rgba(255,233,233,1)",
"1.00": "rgba(255,255,255,1)"
}, {
"0": "rgba(255,255,255,0)",
"0.29": "rgba(0,0,148,1)",
"0.33": "rgba(0,0,170,1)",
"0.37": "rgba(0,0,191,1)",
"0.42": "rgba(0,0,212,1)",
"0.46": "rgba(0,0,233,1)",
"0.50": "rgba(0,0,255,1)",
"0.54": "rgba(21,21,255,1)",
"0.58": "rgba(42,42,255,1)",
"0.62": "rgba(63,63,255,1)",
"0.67": "rgba(85,85,255,1)",
"0.71": "rgba(106,106,255,1)",
"0.75": "rgba(127,127,255,1)",
"0.79": "rgba(148,148,255,1)",
"0.83": "rgba(170,170,255,1)",
"0.87": "rgba(191,191,255,1)",
"0.92": "rgba(212,212,255,1)",
"0.96": "rgba(233,233,255,1)",
"1.00": "rgba(255,255,255,1)"
}, {
"0": "rgba(255,255,255,0)",
"0.29": "rgba(0,148,148,1)",
"0.33": "rgba(0,170,170,1)",
"0.37": "rgba(0,191,191,1)",
"0.42": "rgba(0,212,212,1)",
"0.46": "rgba(0,233,233,1)",
"0.50": "rgba(0,255,255,1)",
"0.54": "rgba(21,255,255,1)",
"0.58": "rgba(42,255,255,1)",
"0.62": "rgba(63,255,255,1)",
"0.67": "rgba(85,255,255,1)",
"0.71": "rgba(106,255,255,1)",
"0.75": "rgba(127,255,255,1)",
"0.79": "rgba(148,255,255,1)",
"0.83": "rgba(170,255,255,1)",
"0.87": "rgba(191,255,255,1)",
"0.92": "rgba(212,255,255,1)",
"0.96": "rgba(233,255,255,1)",
"1.00": "rgba(255,255,255,1)"
}, {
"0": "rgba(255,255,255,0)",
"0.29": "rgba(0,148,148,1)",
"0.33": "rgba(0,170,170,1)",
"0.37": "rgba(0,191,191,1)",
"0.42": "rgba(0,212,212,1)",
"0.46": "rgba(0,233,233,1)",
"0.50": "rgba(0,255,255,1)",
"0.54": "rgba(21,255,255,1)",
"0.58": "rgba(42,255,255,1)",
"0.62": "rgba(63,255,255,1)",
"0.67": "rgba(85,255,255,1)",
"0.71": "rgba(106,255,255,1)",
"0.75": "rgba(127,255,255,1)",
"0.79": "rgba(148,255,255,1)",
"0.83": "rgba(170,255,255,1)",
"0.87": "rgba(191,255,255,1)",
"0.92": "rgba(212,255,255,1)",
"0.96": "rgba(233,255,255,1)",
"1.00": "rgba(255,255,255,1)"
}, {
"0": "rgba(255,255,255,0)",
"0.29": "rgba(0,148,148,1)",
"0.33": "rgba(0,170,170,1)",
"0.37": "rgba(0,191,191,1)",
"0.42": "rgba(0,212,212,1)",
"0.46": "rgba(0,233,233,1)",
"0.50": "rgba(0,255,255,1)",
"0.54": "rgba(21,255,255,1)",
"0.58": "rgba(42,255,255,1)",
"0.62": "rgba(63,255,255,1)",
"0.67": "rgba(85,255,255,1)",
"0.71": "rgba(106,255,255,1)",
"0.75": "rgba(127,255,255,1)",
"0.79": "rgba(148,255,255,1)",
"0.83": "rgba(170,255,255,1)",
"0.87": "rgba(191,255,255,1)",
"0.92": "rgba(212,255,255,1)",
"0.96": "rgba(233,255,255,1)",
"1.00": "rgba(255,255,255,1)"
}, {
"0": "rgba(255,255,255,0)",
"0.29": "rgba(0,148,148,1)",
"0.33": "rgba(0,170,170,1)",
"0.37": "rgba(0,191,191,1)",
"0.42": "rgba(0,212,212,1)",
"0.46": "rgba(0,233,233,1)",
"0.50": "rgba(0,255,255,1)",
"0.54": "rgba(21,255,255,1)",
"0.58": "rgba(42,255,255,1)",
"0.62": "rgba(63,255,255,1)",
"0.67": "rgba(85,255,255,1)",
"0.71": "rgba(106,255,255,1)",
"0.75": "rgba(127,255,255,1)",
"0.79": "rgba(148,255,255,1)",
"0.83": "rgba(170,255,255,1)",
"0.87": "rgba(191,255,255,1)",
"0.92": "rgba(212,255,255,1)",
"0.96": "rgba(233,255,255,1)",
"1.00": "rgba(255,255,255,1)"
}];
Array.prototype.clean = function (deleteValue) {
for (var i = 0; i < this.length; i++) {
if (this[i] == deleteValue) {
this.splice(i, 1);
i--;
}
}
return this;
};
function initialize() {
var mapOptions = {
zoom: 5,
center: new google.maps.LatLng(39, -95),
mapTypeId: google.maps.MapTypeId.ROADMAP,
suppressInfoWindows: true
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
$addLayerBtn = $('.btn.action-addLayer');
$loader.fadeOut();
}
function addLayer(xxx, yyy, zzz, aaa, bbb) {
var layerTextArray = [],
$layers = $('ul.layers'),
layerId = layers.length,
$layer = $('<li />').addClass('layer').data('layerid', layerId);
$loader.fadeIn(animation_speed);
// ... do some stuff ...
$.ajax({
url: '/API/xxx',
type: 'get',
data: {
v: new Date().getTime(),
xxx: xxx
}
}).done(function (response) { // returns JSON array of objects
$(response).each(function () {
var node = this;
dataPoints.push(new google.maps.LatLng(node.latitude, node.longitude));
});
pointArray = new google.maps.MVCArray(dataPoints);
var heatmap = new google.maps.visualization.HeatmapLayer({
opacity: 0.8,
radius: 20,
data: pointArray,
gradient: gradients[layerId],
map: map
});
layers.push(heatmap);
$loader.fadeOut(animation_speed);
});
}
$addLayerBtn.on('click', function (event) {
var $this = $(this)
//...
;
event.preventDefault();
addLayer(xxx, yyy, zzz, aaa, bbb);
});
google.maps.event.addDomListener(window, 'load', initialize);})(jQuery);
（函数（$）{
变量映射、点阵列、热图、数据点=[]，
层=[]，
$loader=$（'.loader，.loader overlay'），
动画速度=666，
$addLayerBtn=$（'.btn.action addLayer'），
梯度=[{
“0”：“rgba（255255,0）”，
“0.29”：“rgba（148,0,0,1）”，
“0.33”：“rgba（170,0,0,1）”，
“0.37”：“rgba（191,0,0,1）”，
“0.42”：“rgba（212,0,0,1）”，
“0.46”：“rgba（233,0,0,1）”，
“0.50”：“rgba（255,0,0,1）”，
“0.54”：“rgba（255,21,21,1）”，
“0.58”：“rgba（255,42,42,1）”，
“0.62”：“rgba（255,63,63,1）”，
“0.67”：“rgba（255,85,85,1）”，
“0.71”：“rgba（255106106,1）”，
“0.75”：“rgba（255127127,1）”，
“0.79”：“rgba（255148148,1）”，
“0.83”：“rgba（255170170,1）”，
“0.87”：“rgba（255191191,1）”，
“0.92”：“rgba（255212212,1）”，
“0.96”：“rgba（255233233,1）”，
“1.00”：“rgba（255255,1）”
}, {
“0”：“rgba（255255,0）”，
“0.29”：“rgba（0,0148,1）”，
“0.33”：“rgba（0,0170,1）”，
“0.37”：“rgba（0,0191,1）”，
“0.42”：“rgba（0,0212,1）”，
“0.46”：“rgba（0,0233,1）”，
“0.50”：“rgba（0,0255,1）”，
“0.54”：“rgba（21,21255,1）”，
“0.58”：“rgba（42,42255,1）”，
“0.62”：“rgba（63,63255,1）”，
“0.67”：“rgba（85,85255,1）”，
“0.71”：“rgba（106255,1）”，
“0.75”：“rgba（127255,1）”，
“0.79”：“rgba（148255,1）”，
“0.83”：“rgba（170255,1）”，
“0.87”：“rgba（191255,1）”，
“0.92”：“rgba（212212255,1）”，
“0.96”：“rgba（233255,1）”，
“1.00”：“rgba（255255,1）”
}, {
“0”：“rgba（255255,0）”，
“0.29”：“rgba（0148148,1）”，
“0.33”：“rgba（0170170,1）”，
“0.37”：“rgba（0191191,1）”，
“0.42”：“rgba（0212212,1）”，
“0.46”：“rgba（0233233,1）”，
“0.50”：“rgba（0255255,1）”，
“0.54”：“rgba（21255255,1）”，
“0.58”：“rgba（42255255,1）”，
“0.62”：“rgba（63255255,1）”，
“0.67”：“rgba（85255255,1）”，
“0.71”：“rgba（106255255,1）”，
“0.75”：“rgba（127255255,1）”，
“0.79”：“rgba（148255255,1）”，
“0.83”：“rgba（170255255,1）”，
“0.87”：“rgba（191255255,1）”，
“0.92”：“rgba（212255255,1）”，
“0.96”：“rgba（233255255,1）”，
“1.00”：“rgba（255255,1）”
}, {
“0”：“rgba（255255,0）”，
“0.29”：“rgba（0148148,1）”，
“0.33”：“rgba（0170170,1）”，
“0.37”：“rgba（0191191,1）”，
“0.42”：“rgba（0212212,1）”，
“0.46”：“rgba（0233233,1）”，
“0.50”：“rgba（0255255,1）”，
“0.54”：“rgba（21255255,1）”，
“0.58”：“rgba（42255255,1）”，
“0.62”：“rgba（63255255,1）”，
“0.67”：“rgba（85255255,1）”，
“0.71”：“rgba（106255255,1）”，
“0.75”：“rgba（127255255,1）”，
“0.79”：“rgba（148255255,1）”，
“0.83”：“rgba（170255255,1）”，
“0.87”：“rgba（191255255,1）”，
“0.92”：“rgba（212255255,1）”，
“0.96”：“rgba（233255255,1）”，
“1.00”：“rgba（255255,1）”
}, {
“0”：“rgba（255255,0）”，
“0.29”：“rgba（0148148,1）”，
“0.33”：“rgba（0170170,1）”，
“0.37”：“rgba（0191191,1）”，
“0.42”：“rgba（0212212,1）”，
“0.46”：“rgba（0233233,1）”，
“0.50”：“rgba（0255255,1）”，
“0.54”：“rgba（21255255,1）”，
“0.58”：“rgba（42255255,1）”，
“0.62”：“rgba（63255255,1）”，
“0.67”：“rgba（85255255,1）”，
“0.71”：“rgba（106255255,1）”，
“0.75”：“rgba（127255255,1）”，
“0.79”：“rgba（148255255,1）”，
“0.83”：“rgba（170255255,1）”，
“0.87”：“rgba（191255255,1）”，
“0.92”：“rgba（212255255,1）”，
“0.96”：“rgba（233255255,1）”，
“1.00”：“rgba（255255,1）”
}, {
“0”：“rgba（255255,0）”，
“0.29”：“rgba（0148148,1）”，
“0.33”：“rgba（0170170,1）”，
“0.37”：“rgba（0191191,1）”，
“0.42”：“rgba（0212212,1）”，
“0.46”：“rgba（0233233,1）”，
“0.50”：“rgba（0255255,1）”，
“0.54”：“rgba（21255255,1）”，
“0.58”：“rgba（42255255,1）”，
“0.62”：“rgba（63255255,1）”，
“0.67”：“rgba（85255255,1）”，
“0.71”：“rgba（106255255,1）”，
“0.75”：“rgba（127255255,1）”，
“0.79”：“rgba（148255255,1）”，
“0.83”：“rgba（170255255,1）”，
“0.87”：“rgba（191255255,1）”，
“0.92”：“rgba（212255255,1）”，
“0.96”：“rgba（233255255,1）”，
“1.00”：“rgba（255255,1）”
}];
Array.prototype.clean=函数（deleteValue）{
for（var i=0；i