A grid layout for d3.js
A grid layout for d3.js. The layout gradually expands to fit its nodes/cells within its boundaries.
See the demo for a better explanation.
d3 has a super-intriguing but also perplexing API, so hopefully this lines up with the built-in layouts OK.
Built for use with browserify - open an issue or pull request if you'd like to use it with something else :)
npm install d3-grid-layout
gridLayout = require('d3-grid-layout')(d3)
Load up the grid layout by passing it your instance of d3.
grid = gridLayout([nodes])
Create a new grid layout, optionally with an array of data to initiate with.
Append multiple items to the data array.
Append a single item to the data array.
Sort items in the grid by a comparator function.
Set the width of the grid layout.
Set the height of the grid layout.
Pass a boolean to enable/disable centering of the layout (e.g.
Alternatively, pass an array for toggling horizontal and vertical centering
Change the transition rate when updating the grid layout - defaults to
The maxiumum amount of distance between points in the grid.
Replace the current set of nodes with a new array.
Set the easing function. Takes either a custom easing function, or the same
Forces an animation tick.
Updates the grid layout - this is done automatically when using
grid.push, but should be triggered manually otherwise.