Skip to content
This repository has been archived by the owner on Oct 2, 2019. It is now read-only.

Handle collinear (and cocircular) points? #12

Closed
m-rutter opened this issue Jul 18, 2016 · 5 comments
Closed

Handle collinear (and cocircular) points? #12

m-rutter opened this issue Jul 18, 2016 · 5 comments

Comments

@m-rutter
Copy link

m-rutter commented Jul 18, 2016

So I stumbled upon this bug with d3.voronoi with this particular dataset:
http://jsbin.com/sogamotefo/edit?html,js,console

The bug also exists in the most recent version of d3v3, and if you swap the accessors for x & y it actually causes the browser to hang indefinitely with no error messages as though it it stuck in a loop:

// warning, replacing voronoiGen in the jsbin with this snippet will cause the browser to hang.
var voronoiGen = d3.voronoi()
  .x(function(d) {return y(d.y);})
  .y(function(d) {return x(d.x);})
  .extent([[0, 0], [500, 500]]);
@mbostock mbostock changed the title Clipcell() "TypeError: Cannot read property '0' of null Handle collinear (and cocircular) points? Jul 18, 2016
@mbostock
Copy link
Member

The problem is that your input is (approximately) collinear:

screen shot 2016-07-18 at 2 32 08 pm

Unfortunately, this Voronoi implementation doesn’t gracefully handle such input. As Jason wrote in d3/d3#1895 (comment),

This is a specific instance of a more general problem: there is more than one possible Delaunay triangulation for n ≥ 4 cocircular points; otherwise there is always a unique triangulation satisfying the Delaunay property. I think a reasonable fix is to pick an arbitrary Delaunay triangulation in this situtation.

Your input data exhibits a similar error here:

http://www.raymondhill.net/voronoi/rhill-voronoi.html

If you click “Clear all sites”, paste this in, and then click “Parse as sites”:

0.03638187704872731,464.2891731435667
18.726131781749977,447.97448002565795
79.47054617672242,394.9493467555858
126.61481653614429,353.7960778727167
178.5339693099149,308.4747092741625
197.96420712404677,291.51362799902915
266.8323214526062,231.39713866083747
343.10585755513114,164.81629403340833
421.6683900355436,96.23733420146249
497.7763624024437,29.80101379463332

You’ll see a TypeError: Cannot read property 'site' of undefined.

I probably won’t be able to fix this in the near future… Sorry. You can probably work around by adding a tiny amount of random jitter to your points (though that is no guarantee, in the extremely unlikely case your jittered input happens to still be collinear or cocircular).

Related d3/d3#235 d3/d3#1895 gorhill/Javascript-Voronoi#12.

@m-rutter
Copy link
Author

m-rutter commented Jul 18, 2016

Yeah, I thought it might be related to that existing issue as those sets of values are highly correlated. I'm building an interface in which I'm allowing users to plot different sets of values, including that rather uninteresting pair. It would be nice if it could fail gracefully so I could plot something else or render a message in its place. Right now the user has the potential to kill the browser window with an indefinite loop if they are an especially boring and/or unlucky individual :P

I would like to take the opportunity Mike to thank you for this library, and the continuing work and support you have put in including the countless examples and high quality tutorials. Taking the time to learn your library helped me get my first job as a developer, and so I'm personally very grateful.

@mbostock
Copy link
Member

Thank you. I expect that adding a tiny bit of random jitter would be safe if you don’t mind sacrificing accuracy.

@m-rutter
Copy link
Author

m-rutter commented Jul 18, 2016

Yep, adding jitter with Math.random() to the scaled value in the accessors is a good enough trade off for my (and I imagine the majority of) cases.

const voronoiGen = voronoi()
      .x(d => x(d.x) + Math.random())
      .y(d => y(d.y) + Math.random())
      .extent([[0, 0], [w, h]]);

@mbostock
Copy link
Member

I’d recommend subtracting by 0.5 so that the average jitter is still zero, like this example:

var voronoi = d3.voronoi()
    .x(function(d) { return d.x + Math.random() - 0.5; })
    .y(function(d) { return d.y + Math.random() - 0.5; });

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Development

No branches or pull requests

2 participants