Dzięki, ale nadal mam problem.
Dokładniej..
Mam taki kod
this._fn = {
lng: function(d) { return d[0]; },
lat: function(d) { return d[1]; },
MeasureValue: function(d) { return d[2]; },
fill: function(d) {
var val = this._fn.MeasureValue(d);
var color;
if(val == -1){
color = this.options.color;
}else if(val >= 0 & val < 25){
color = '#6bc926';
}else if (val >= 26 & val < 50){
color = '#d1cf1e';
}else if (val >= 51 & val < 90){
color = '#efbb0f';
}else if (val >= 91 & val < 180){
color = '#ef7120';
}else if (val >= 181){
color = '#ef2a36';
}
return color;
}
};
/**
* Przerysowanie SVG
*/
redraw : function() {
var that = this;
if (!that._map) {
return;
}
var zoom = map.getZoom();
var output_zoom = document.getElementById("zoom");
output_zoom.innerHTML = zoom;
// Generate the mapped version of the data
var data = that._data.map(function(d) {
var lng = that._fn.lng(d);
var lat = that._fn.lat(d);
var point = that._project([ lng, lat ]);
return {
o: d,
point: point
};
});
// Select the hex group for the current zoom level. This has
// the effect of recreating the group if the zoom level has changed
var join = this._d3Container.selectAll('g.hexbin')
.data([ this._map.getZoom() ], function(d) { return d; });
// enter
var enter = join.enter().append('g')
.attr('class', function(d) { return 'hexbin zoom-' + d; });
// enter + update
var enterUpdate = enter.merge(join);
// exit
join.exit().remove();
// add the hexagons to the select
this._createHexagons(enterUpdate, data);
},
_createHexagons : function(g, data) {
var that = this;
var color = 'red';
var r = that._fn.fill(data.o);
// Tworzenie binów
var bounds = that._map.getBounds();
// Łączenie hexagonów z punktami
var bins = that._hexLayout(data);
bins = bins.filter(function(d) { return bounds.contains(that._map.layerPointToLatLng(L.point(d.x, d.y))); });
var join = g.selectAll('g.hexbin-container').data(bins, function(d) { return d.x + ':' + d.y; });
join.select('path.hexbin-hexagon').transition().duration(that.options.duration)
.attr('fill', color)
.attr('fill-opacity', that.options.opacity)
.attr('stroke-opacity', that.options.opacity)
.attr('d', function(d) { return that._hexLayout.hexagon(r); });
var enter = join.enter().append('g').attr('class', 'hexbin-container');
enter.append('path').attr('class', 'hexbin-hexagon')
.attr('transform', function(d) { return 'translate(' + d.x + ',' + d.y + ')'; })
.attr('d', function(d) { return that._hexLayout.hexagon(r); })
.attr('fill', color)
.attr('fill-opacity', 0.01)
.attr('stroke-opacity', 0.01)
.transition().duration(that.options.duration)
.attr('fill-opacity', that.options.opacity)
.attr('stroke-opacity', that.options.opacity)
.attr('d', function(d) { return that._hexLayout.hexagon(that.options.radius); });
// Grid
enter.append('path').attr('class', 'hexbin-grid')
.attr('transform', function(d) { return 'translate(' + d.x + ',' + d.y + ')'; })
.attr('d', function(d) { return that._hexLayout.hexagon(r); })
.attr('fill', 'none')
.attr('stroke', 'none')
.style('pointer-events', that.options.pointerEvents)
.on('click', function(d, i) { that._dispatch.call('click', this, d, i); });
// Exit
var exit = join.exit();
exit.select('path.hexbin-hexagon')
.transition().duration(that.options.duration)
.attr('fill-opacity', 0)
.attr('stroke-opacity', 0)
.attr('d', function(d) { return that._hexLayout.hexagon(0); });
exit.transition().duration(that.options.duration)
.remove();
},
tablica data.o powinna mieć3 kolumny [0],[1],[2] dlaczego kod daje mi taki błąd ?
Cytat:Uncaught TypeError: Cannot read property 'MeasureValue' of undefined
at Object.fill (test.js:35)
at e._createHexagons (test.js:175)
at e.redraw (test.js:166)
at e.onAdd (test.js:88)
at e._layerAdd (leaflet.js:5)
at e.whenReady (leaflet.js:5)
at e.addLayer (leaflet.js:5)
at e.addTo (leaflet.js:5)
at Object.complete (maps.js:43)
at i (jquery.min.js:2)
32 linia kodu to
MeasureValue: function(d) { return d[2]; },
z tego kodu co wstawiłem na początku. Co robię źle ?