Grid layout in combination with multi-dimensional sorting using d3.comparator.
Filtering items in a grid layout.
Filtering items in a grid layout with a fixed amount of columns and rows.
A little experiment to see if animating >500 SVG path elements really puts us in the "middle of screwed-up country" as Dominikus Baur puts it in his excellent write-up about the OECD Better Life Index HTML5 implementation.
Topographic map of Switzerland with map data from Swiss Maps 2.0.
Thanks to Hugo Lopez for his approach on generating contour polygons.
Extract and list Swiss municipality coordinates from TopoJSON.
Re-implementation of this example combining React with D3 and TopoJSON. Map data from Swiss Maps.
Avoid restarting running transitions by either starting one just on the .enter()
selection or by using selection.filter()
to only select elements which are not in transit yet.
Alternative implementations combining D3 with React and React TransitionGroup.
Using D3 in a React component to transition elements. Alternative implementations only with D3 and using React's TransitionGroup addon.
Using D3 in a React TransitionGroup to transition elements. D3 is used purely for transitions, not for data joins. The distinction between entering and exiting elements is handled by the TransitionGroup component. See the React documentation for further information.
Alternative implementations only with D3 and using React without addons.
Note: This implementation is around 30% slower in processing 1000 circles than the other two.