d3.contour for isolines on leaflet map

Community Help
1

Hi,
I’m trying to achieve drawing isolines of elevations on a leaflet map.
I thought using d3.contours or d3.contourDensity but I’ve the following problem.
I’ve as data object an array of 8094 objects with 3 values (altitude, latitude, longitude).
Data values cover an area with altitude point each 25 meters.

When I use contourDensity I can specify x and y using such code:

var contourData = d3.contourDensity()
.x(function(d, i) {return thisObj.map.latLngToLayerPoint([d.latitude, d.longitude]).x; })
.y(function(d) { return thisObj.map.latLngToLayerPoint([d.latitude, d.longitude]).y; })
.weight(function(d) { return d.altitude; })
.size([width, height])
.bandwidth(30)
(dataValues)

I get geoJson data but they do not respect altitude value. It looks like the contour generated values apply only to the position lat, long.

Am I doing something wrong ? The weight function does not consider contours about the indicated value ? Misunderstood it perhaps.

Thanks for your help.

2

The density contours are here to count the points in a given neighborhood—for your goal I think you’ll need to use the (simple) contour function. However note that this function operates on gridded data.

In case your data is not gridded, you need to follow the same strategy as Plot.contour instead—it can operate on non-gridded samples with three accessors x, y, and value, by applying spatial interpolators. (Plot’s spatial interpolators can be used independently of Plot, to pre-compute a grid on which you can apply d3.contour).

Sorry if this is a bit complicated—I can build an example if there is interest.

3

Hi Fil, thanks for your answer.
Never used Plot.contour.
If you could send me an example would be fine.

Arturo

4
5

Thanks for the tip.

Just a more question. Once I’ve got gridded data as from example:

data: Array(30000) [
0: -106.13189560424354
1: -106.81096104350587
…

It contains in my case altitude values, then d3.contours as well produces geoJson MultiPolygon structure with altitude values, then how can I return back to latitude and longitude corresponding values ?

I think I’ve lost relation from altitudes and lat,long values.

6

The relation between lon lat and grid coordinates is through the x and y scales. You’ll need to apply them in reverse. I added the necessary code in the notebook.

7

Thanks for your help.