natural breaks for coloring

[Drew Dara-Abrams]

Hello all,

Has anyone used d3 to compute natural breaks for coloring? See:
http://en.wikipedia.org/wiki/Jenks_Natural_Breaks_Optimization#Choropleth_mapping
and
http://www.gal-systems.com/2011/08/calculating-jenks-natural-breaks-in.html

Thanks,
Drew

[Mike Bostock]

> Has anyone used d3 to compute natural breaks for coloring?

I have not, but keep me posted if you do. I love ColorBrewer for thematic maps:

http://colorbrewer2.org/

There are CSS and JS files for ColorBrewer included in the git
repository. If you end up rolling your own color scales, Jeff Heer has
also implemented L*a*b* color space support for D3 (see his fork), and
there are other JavaScript color space implementations available.

Mike

[Drew Dara-Abrams]

Mike,

Yeah, I've had good luck with ColorBrewer. I had forgotten about the CSS/JS files in the repo; will have to make use of those.

Here's the Python code I'm using on the server side to do the natural breaks classification: https://gist.github.com/1299198 Sometime soon I'll probably need to use this on the client side as well, so I'll rewrite it as JavaScript.

Do you see a place for this in d3?

Drew

[Mike Bostock]

Ah, interesting. I thought you were describing natural breaks in color
space, rather than natural breaks in data space (which you then map to
existing color scales). I typically use either a quantize or quantile
scale for this purpose, which have well-defined behaviors. The natural
break approach relies more heavily on having a legend for
understanding, but I could still see it as being useful.

It'd be great to have an example of how to do this in JavaScript. If
it's something that is commonly-needed, we could figure out a place to
put it in D3, perhaps as a scale.

Mike

[Drew Dara-Abrams]

Yeah, I should have mentioned that it's a scale in data space. Useful
when you have "clumpy" data that don't display well in quantiles.

Down the line when I have JS code, I'll post again...

Drew

[Fiachra O Donoghue]

There's a project that implements Jenks algorithm in JavaScript at https://github.com/simogeo/geostats. This gist: https://gist.github.com/1302938 is a function I adapted (mostly just copied) from D3's d3.scale.quantile to accept an additional argument that names a function from the simogeo/geostats library and returns the class breaks generated by that classsification algorithm. 

For Jenks you'd call it like this:  

var classes = d3.scale.flexiclass('getJenks').domain([domain]).range([range]);

It also has equal intervals ('getEqInterval') and quantiles('getQuantile').

Regards

Fiachra

[Marjorie Roswell]

Here's another implementation:
https://gist.github.com/tmcw/4969184

Would love to see this (along with associated legend) built into D3.

[Michael Neutze]

I second Marjorie's proposal.

Tom MacWright's (of mapbox fame) Jenks implementation has been proven easy to implement, provides great results and would make a valuable addition to d3js.

http://macwright.org/simple-statistics/docs/simple_statistics.html

Mike, do prefer this as a feature request on github?

Tom went to great length studying the original research of Jenks instead of rewriting that age-old fortran implementation, see here

http://macwright.org/2013/02/18/literate-jenks.html

[Daniele Pennati]

Hello,

I've implemented the simple_statistics jenks scale in a d3 map.

but I have an issue... If I set the same number of classes for the scale in d3, in qGis or in ArchMap I got 3 really different results.

There isn't a common algorithm to determine the natural brakes? Do you have any idea why I got different brakes with the same dataset?

thanks

Daniele