javascript - lineas - highcharts statistics

Efecto secundario extendido Highmaps

Question

Intento crear un mapa de densidad de puntos del estado de Florida. Aunque sé que Highmaps no es compatible con el eje de color con los puntos de mapa. Lo extendí y funciona, pero tiene un efecto secundario. Cuando hago clic en una de las categorías en la leyenda, no se oculta. Por ejemplo, si hago clic en ''> 10'', todos los valores superiores a 10 no se ocultan. Cuando abro el depurador de Chrome, declaro que: a.setVisible no es una función. ¿Qué puedo hacer para resolver este problema? Este es un requisito, aunque parezca menor. Agradecería cualquier tipo de consejos o tal vez algún tipo de ejemplo sería perfecto. No puedo mostrar más código de lo que se muestra. Si necesita que explique más sobre el problema, me complacerá hacerlo.

 (function (H) {
H.seriesTypes.mappoint.prototype.axisTypes = [ ''xAxis'', ''yAxis'', ''colorAxis''];
H.wrap(H.seriesTypes.mappoint.prototype, "translate", function (p) {
p.call(this);
H.seriesTypes.mappoint.prototype.translateColors.call(this);
});
H.seriesTypes.mappoint.prototype.translateColors = H.seriesTypes.heatmap.prototype.translateColors;
H.seriesTypes.mappoint.prototype.colorKey = ''value'';
})(Highcharts);
// Initiate the chart
$(''#container'').highcharts(''Map'', {
title: {
text: title
},
mapNavigation: {
enabled: false,
},
colorAxis: {
dataClasses: [{
from: 0,
to: 3,
color: "#66FFFF"
}, {
from: 4,
to: 9,
color: "#0099FF"
}, {
from: 10,
color: "#0000FF"
}
]
},
tooltip:
{
enabled: true
}
,
series: [{
mapData: Highcharts.maps[''countries/us/us-fl-all''],
name: ''Basemap'',
borderColor: ''#A0A0A0'',
nullColor: ''rgba(200, 200, 200, 0.3)'',
showInLegend: false,
},
{
// Specify points using lat/lon
type: ''mappoint'',
name: ''A'',
turboThreshold: 2000000,
data: p_data,
dataLabels: {
enabled: false
}
},
{
// Specify points using lat/lon
type: ''mappoint'',
name: ''B'',
turboThreshold: 2000000,
data: m_data,
dataLabels: {
enabled: false
}
},
{
// Specify points using lat/lon
type: ''mappoint'',
name: ''C'',
turboThreshold: 2000000,
data: h_data,
dataLabels: {
enabled: false
}
}
]});

Una muestra para jugar: http://jsfiddle.net/dlope073/4mabw6zr/2/

Answer 1

Use el método setVisible de la serie de map predeterminada. Me gusta esto: http://jsfiddle.net/4mabw6zr/3

(function (H) {
H.seriesTypes.mappoint.prototype.axisTypes = [''xAxis'', ''yAxis'', ''colorAxis''];
H.seriesTypes.mappoint.prototype.pointClass.prototype.setVisible = H.seriesTypes.map.prototype.pointClass.prototype.setVisible; // use the same setVisible method as map type.
H.wrap(H.seriesTypes.mappoint.prototype, "translate", function (p) {
p.call(this);
H.seriesTypes.mappoint.prototype.translateColors.call(this);
});
H.seriesTypes.mappoint.prototype.translateColors = H.seriesTypes.heatmap.prototype.translateColors;
H.seriesTypes.mappoint.prototype.colorKey = ''value'';
})(Highcharts);