I received a question from a commentor asking how one might use the Pan and Zoom demo with a force layout. I came up with a couple of ways to do it. Option #1 The first variation shows the quick and dirty approach which essentially bypasses the nice, reusable structures I spent time implementing in… Read More »
I put together a little demo to show how to setup a canvas with a corresponding minimap that displays an overview of the contents of the canvas. You can use the mousewheel on either the main canvas or the minimap to zoom in and out. You can also drag either the image or the minimap… Read More »
I had a question in the comments for the treemap label wrapping post about how to go about truncating the labels within the d3 Circle Pack example from Mike Bostock. Here is what I came up with. For the sake of brevity, I used the SVG text element so you get truncation but not wrapping.… Read More »
One d3 visualization I’ve been refining for a while now uses a flowing tree layout. I wanted to have a structure similar to the standard d3 tree layout which would position consistently-sized leaf nodes (children) in a recursively flowing (wrapping) arrangement. I also wanted to take a stab at building this layout as a library… Read More »
I received a comment asking how to truncate labels in my treemap example. Here is a quick example showing how I handled it on a recent project. I am sure there are other ways to do this and if anyone has a better alternative, please detail it in the comments. Basically, when using labels in… Read More »
The D3 library is really a great way to create data visualizations in HTML5. I absolutely love it and its treemap is especially powerful. I wanted to create a treemap that showed grouping headers like the JIT version that has been around for a while, but it took a little more work to get D3… Read More »