fix stitching

[Fil]

See d3/d3-contour#25

[PBrockmann]

Thank you very much. Seems to be nearly good.
Thus, implemented with an orthographic projection, I can see that some problems du to the antimeridian line persist.

Perhaps by duplicating first and last columns.

[Fil]

Are we using the same dataset? I can't seem to find the exact same features on my map.

However, there are two things to note:

1. the cusps you see near the pole are on the other side of the pole, so around 0° — with the original dataset I see similar cusps, but they are at [9,88] and [10,86]. IMO they just happen because the density of dots on those high-latitude parallels is very high, which means lots of points and "more details" — ie more wiggle on noisy data. This in a way is due to the dataset being given as plate-carrée, which has lots of area distortion nera the poles (HEALPix would be better). Maybe a solution might be to add some blurring to the data near the poles?

2. The cut in the orange ovoid is a failure to stitch at the antimeridian, because there is only 1 point of contact ( the cusp "from above" and the cusp "from below" reach the same point ie. [0,5.5] on one side, and [360,5.5] on the other, in planar coordinates). I've added a special case for this

geo computation is always challenging because of topological problems such as these. We have a similar difficulty for geoVoronoi (see d3/d3#1820 and the not-very-satisfying solution at https://github.com/Fil/d3-geo-voronoi).

I think it would be very useful to work and adapt d3.contour to create a geoContour algorithm, but I would be surprised if it was straightforward. The solutions presented here feel a bit hack-ish.

[PBrockmann]

Agree about the not straigtforward algorithm of the stitching and +1 for a geoContour algorithm !
Thank again for your interest in this issue that will be very usefull for my community (Earth System Modeling).
My last capture comes from synchronized_maps_03.html (just updated on thresholds settings). You have there 2 fields uwnd and vwnd. The capture was taken from vwnd.
I will investigate duplication of columns because it could solve some problems.

[PBrockmann]

Here is a piece of lines to duplicates columns (considering the array as modulo 360).

    values = nj.array(values).reshape(jsize,isize);		//  a matrix with n rows and m columns, shape will be [n,m]. 
    values = values.slice([null, null, -1],null); 
    values = nj.concatenate(values.slice(null,[isize-1,isize]), values);
    values = nj.concatenate(values, values.slice(null,[1,2]));
    values = values.flatten().tolist();

You have then an array 362, 180 where contours on antimeridian should be smoother since columns at start and end have their neighbour columns.

Then comes some cooking to deal only with correct columns that are from 1 to 361.

function invert(d) {
    var shared = {};
    var p = {
      type: "Polygon",
      coordinates: d3.merge(d.coordinates.map(function(polygon) {
        return polygon.map(function(ring) {
		var ring2 = [];
		  for (i = 0; i < ring.length; i++) {
		    if (ring[i][0] < 1) ring2.push([- 180, 90 - ring[i][1] / jsize * 180]);
		    else if (ring[i][0] > 361) ring2.push([180, 90 - ring[i][1] / jsize * 180]);
		    else ring2.push([(ring[i][0]-1) / isize * 360 - 180, 90 - ring[i][1] / jsize * 180]);
		  }
		   return ring2.slice();
        });
      }))
    };

That was the direction I was taken before your proposition.

[Fil]

I followed up on your idea. But success came only when I pasted the same column before and after. I've now simplified it to just copy the left column to the right hand side. So we work on a 361x180 matrix. I need to check a few things and will post the code tomorrow. But the result looks good

[Fil]

I think the example is good now.

I've also pushed another commit that uses topojson.simplify to remove some dots (especially near the poles where the density is really unnecessarily high). It allows better interactive rotations by making them faster — but it does not solve the cusps at [9,88] and [10,86].

Next step will be to abstract all this code into a d3.geoContour() function.

[Fil]

I've also worked on an Observable notebook, in which I wrapped the code differently and got rid of numjs.
https://beta.observablehq.com/@fil/netcdf

It makes nice images, but it would help if I knew where the data comes from and what it represents :-) Also I'm not always sure of how to read the data. For example datasource 3 is still a mystery.

[PBrockmann]

netCDF files used in the repo come from http://ferret.pmel.noaa.gov/Ferret/documentation/users-guide/introduction/SAMPLE-DATA-SET (ferret is a very common and easy tool to explore model output and netCDF files).

• uwnd and vwnd are respectevely zonal wind and meridional wind.
  They have been extracted from monthly_navy_winds.nc that is the monthly-averaged Naval Fleet Numerical Oceanography Center global marine winds (1982-1990)

• temp is the sea surface temperature and comes from the levitus_climatology.

• rose is the relief of the earth's surface at 60-minute resolution and comes from the etopo60 file.

I have made those extraction because the reading of the netCDF files using netCDFjs is not as flexible as I expected. See cheminfo/netcdfjs#14
Perhaps there is another lib to do this (direct read of netCDF files without node.js) but I haven't found.

[PBrockmann]

Thank you for all your input.

[PBrockmann]

Have just commit a synchronized_maps_03.html with a select to ease testing on contours (smoothed or not).

Not too bad... Anyway much better !

[Fil]

I've added the rotation with d3-inertia in https://beta.observablehq.com/@fil/netcdf

[PBrockmann]

Any suggestions to display the array with the value for each pixel raster as in http://geoexamples.com/d3-raster-tools-docs/plot/drawing-raster-data.html
I have tried with svg elements and it is too huge. I need to investigate use of canvas. Any existing tries on that ?

[Fil]

Yes :) I'm currently developing a system for exactly that, based on WebGL. It's not public yet but soon, I hope.