M
Mike Bostock
bost.ocks.org · Personal blog · on HN since 2011
Mike Bostock, creator of D3.js, writes about data visualization, algorithms, and tools for data workflows.
What HN saysCommenters call his work classic, especially the animated algorithm visualizations and the article on using Make for data workflows.
167HN people shared it
120linked it in comments
62stories submitted
4.0Kstory points
3 months agolast shared
2011people per year2026
Most-shared posts
- 1Visualizing Algorithms53 people · 2.2K points · first shared 2014 · 88 comments on HN
- 2Mike Bostock20 people · 2 points · first shared 2011 · discussion on HN
- 3Why Use Make13 people · 535 points · first shared 2013 · 240 comments on HN
- 4D3: Thinking with Joins12 people · 94 points · first shared 2012 · 5 comments on HN
- 5How To Scroll9 people · 236 points · first shared 2014 · 75 comments on HN
- 6For Example (2013)7 people · 44 points · first shared 2013 · 1 comments on HN
- 7Towards Reusable Charts7 people · 2 points · first shared 2012 · discussion on HN
- 8Map Simplification with Visvalingam's Algorithm6 people · 121 points · first shared 2012 · 30 comments on HN
- 9Path Transitions with D3.js6 people · 4 points · first shared 2012 · discussion on HN
- 10Let's make a map (in D3)5 people · 3 points · first shared 2012 · discussion on HN
- 11Sankey5 people · first shared 2012
- 12Constancy5 people · first shared 2013
- 13Show HN: A visual explanation of Fisher–Yates shuffle4 people · 178 points · first shared 2012 · 37 comments on HN
- 14How D3 Selections Work4 people · 163 points · first shared 2013 · 8 comments on HN
- 15Will It Shuffle?4 people · 19 points · first shared 2012 · 3 comments on HN
What HN people wrote when they linked it
bonsai_spool · 2026-01-24
Mike Bostock had several very lovely visualizations back on the D3.js site which I can't find. Here's a cool blogpost he wrote: https://bost.ocks.org/mike/algorithms/#maze-generation
daniel_grady · 2024-05-06
The classics never go out of style. Mike Bostock has a nice article about the use of Make for data workflows: https://bost.ocks.org/mike/make/.
krwck · 2023-01-11
Not sure if it fits in scope, but I find this classic to be an ingenious intro to where to start from in terms of visualisation:
https://bost.ocks.org/mike/algorithms/
nrjames · 2023-01-11
These animations by Mike Bostock are great:
https://bost.ocks.org/mike/algorithms/
beardicus · 2018-06-23
Semi-related, I love this article by Mike Bostock about using Make to capture some design/data workflows: https://bost.ocks.org/mike/make/
I fiddled with this idea and made a Makefile that downloads a book from the Internet Archive, extracts all the illustrations and tweaks them with ImageMagick: https://github.com/beardicus/bk-fig-phillips/blob/master/Makefile
This isn't the smartest Makefile... I've learned a bit since. Regardless, I find it really fun to smoosh a process into a dependency graph frame-of-mind.
Does anybody else have any examples of "non-traditional" uses of Make? Anything beyond compiling code or using it as a straightforward task runner?
kjeetgill · 2018-06-15
Fantastic piece. I love the systematic approach to refine my intuitions. Not just how to reason about statistics, but how to effectively second guess myself. And the visualisations really help to reflect on that.
Side note:
I thought the visuals we're too impressive, turns out it's written by Mike Bostock of d3.js and bl.ocks.org/mbostock fame. His article "Visualizing Algorithms"[0] is a must read.
[0]: https://bost.ocks.org/mike/algorithms/
matt_j · 2018-02-14
Mike Bostock is the creator of d3.js and does, or did, a bunch of visualizations for NY Times. Check his website, it's amazing.
https://bost.ocks.org/mike/
zawerf · 2018-02-13
If I understand correctly, the reason a CNN is used here is because we want to find the splits that a human would visually agree "looks" the best?
So rather than a regression it's more like the "line simplification" problem in graphics: (https://bost.ocks.org/mike/simplify/ https://en.wikipedia.org/wiki/Ramer%E2%80%93Douglas%E2%80%93Peucker_al…
Just thought this solution seems a little overkill. Surely you can pick some error metric over the splits to optimize instead?
avyfain · 2017-10-28
Every time something like this comes up, I think of Mike Bostocks wonderful Visualizing Algorithms[0]. The essay is not comprehensive, but shows more than just sorting. It also deals with sampling, and with maze generation. Truly worth your time.
[0]: https://bost.ocks.org/mike/algorithms/
danso · 2017-08-18
Worth pointing to Mike Bostock's essay, Why Use Make: https://bost.ocks.org/mike/make/
dovin · 2017-08-01
The great thing about D3 is that Mike Bostock is a prolific writer of tutorials and examples. For map-making, I taught myself a lot of D3 with his Let's Make a Map article (https://bost.ocks.org/mike/map/), which is now a bit outdated with the update to D3 4.x so there's a new tutorial series here: https://medium.com/@mbostock/command-line-cartography-part-1-897aa8f8c…
greggman · 2017-07-20
Used "correctly" the web with JS is way better than the web without. There's plenty of sites that use JS great from actual apps to articles and tutorials with interactive examples. In fact personally I find myself disappointed when I see an article that would clearly be better with interactive diagrams but the authors are stuck thinking the web it just a transmitted book and not it's own medium but better strengths.
A couple of examples where IMO JS makes the page superior to one without
https://mattdesl.svbtle.com/drawing-lines-is-hard
https://bost.ocks.org/mike/algorithms/
https://pomax.github.io/bezierinfo/
Jaruzel · 2017-07-20
> Mike Bostock did a very nice visualization of that here: https://bost.ocks.org/mike/algorithms/
Thank you for that link - a great read!
coreyp_1 · 2017-05-20
Beautiful! I would love to see an animation of it in action (a la https://bost.ocks.org/mike/algorithms/)!
notduncansmith · 2017-02-14
This was cool, the highlighted code tour is a great touch.
For anyone else who enjoyed this, you might also enjoy this blog post full of animated algorithms by Mike Bostock: https://bost.ocks.org/mike/algorithms/
edw · 2017-02-09
Amen right back at ya! (I love the O'Reilly book cover.) I highly recommend people read your blog post. And there's also this classic:
https://aadrake.com/command-line-tools-can-be-235x-faster-than-your-ha…
I'll also take this opportunity to plug Make and Drake for manipulating data in a replicable way:
https://bost.ocks.org/mike/make/
https://github.com/Factual/drake
If you're processing data using tools that cannot trace their ancestry directly to some time before 1985, you're probably wasting your own and your colleagues' time.
zevyoura · 2015-08-22
The article "Visualizing Algorithms" by Mike Bostock has a fantastic section on mazes: http://bost.ocks.org/mike/algorithms/#maze-generation
benihana · 2015-08-18
Great point. Here's a visualization of what you're talking about:
http://bl.ocks.org/mbostock/fe3f75700e70416e37cd
>Uniform random is pretty terrible. There is both severe under- and oversampling: many samples are densely-packed, even overlapping, leading to large empty areas. (Uniform random sampling also represents the lower bound of quality for the best-candidate algorithm, as when the number of candidates per sample is set to one.)
Taken from: http://bost.ocks.org/mike/algorithms/
seaneking · 2015-06-27
This would be awesome. One of my favourite articles of recent is http://bost.ocks.org/mike/algorithms/ which covers this kind of thing.
lelandbatey · 2015-04-20
In the demo there's also a second mode called "Cell" that seems reminiscent of sampling via Poisson Disc, which you can read more about in Mike Bostock's excellent "Visualizing Algorithms" post.[0]
[0] - http://bost.ocks.org/mike/algorithms/
bengali3 · 2015-04-01
Heres a great storytelling example from http://bost.ocks.org/mike/
http://www.nytimes.com/newsgraphics/2013/10/27/south-china-
sea/
alphakappa · 2015-03-17
I agree, the scrolling experience made me exit that page quicker than I should have. This is also a good time to remind folks of Mike Bostock's excellent writeup on scrolling: http://bost.ocks.org/mike/scroll/
akanet · 2014-12-22
I think this article is a fantastic example of how you can blend prose with working interactive examples. The examples make you really trance out watching dungeons being carved out of nothing.
I think an often-discounted aspect of JavaScript's appeal is its ability to breathe life into a bunch of fascinating but otherwise dry concepts. Another terrific example is this page by the prolific Mike Bostock: http://bost.ocks.org/mike/algorithms/
dmarusic16 · 2014-07-07
Works great with d3.js too. Couldn't've made this map of the early days of the Ukraine crisis[0] without Natural Earth.
Also helpful to that end: the Global Administrative Areas[1] database.
Finally, it would've been impossible to even start getting my head around how to go about these things if it wasn't for this amazing tutorial by Mike Bostock[2].
[0] http://www.the-american-interest.com/blog/2014/03/03/the-noose-tighten…
[1] http://www.gadm.org
[2] http://bost.ocks.org/mike/map/
allenkim67 · 2014-06-25
This book is very good and I highly recommend it if you're just starting out. But I didn't feel like I really understood how d3 works until I read these two articles by Mike Bostocks himself.
http://bost.ocks.org/mike/selection/
http://bost.ocks.org/mike/join/
IME, understanding joins and selections is essential when using d3.
yaph · 2014-05-15
Check out this page http://bost.ocks.org/mike/ if you haven't yet, there are several in-depth posts on how to do things with D3, also read the fantastic D3 docs.
I guess making a guide for every Gist Mike posts would be quite demanding regarding his output, in the end even his day only 24 has hours.
viggity · 2013-10-07
very cool, christophe, thanks for taking the time to compile this list.
The one thing that always astounds me about people who generate dataviz with d3 is that they almost never do anything interactive with it (filter, zoom, etc) and if they do, they won't use any of d3's insanely cool/easy transitions to make the visualization smoothly morph from one state to the next.
Really, if you're going to start messing around with d3, read about Mike Bostock's thoughts on change blindness and object constancy.
http://bost.ocks.org/mike/constancy/
amazing example 1:
http://bl.ocks.org/mbostock/1256572
cool example 2:
http://bl.ocks.org/mbostock/3808234
tlrobinson · 2012-11-25
Agreed. This seems like a better introduction than other tutorials I've seen, but it could just be that I've already grokked D3's data binding model through some tutorials plus a bit of trial and error.
This is another must-read: http://bost.ocks.org/mike/join/
hlomas · 2012-06-12
Why not add some more interesting visualizations of your data? Try http://d3js.org. For example http://bost.ocks.org/mike/sankey/ or http://mbostock.github.com/d3/talk/20111116/iris-parallel.html might be adapted to communicate which chords follow the others in a more dense fashion.
TwistedWeasel · 2012-05-09
I've been learning d3.js myself lately, and i'm very impressed. As it's popularity increases it's worth reading this article from Mike Bostock, the creator of d3 proposing some conventions to follow when building charts with d3...
http://bost.ocks.org/mike/chart/