This example created for development purposes using the d3-sankey plugin for D3 4.0.
Based on xaranke's port of Mike Bostock's Sankey Diagram with drag behavior enabled and several fixes for the d3 version 4.x release.
It would be nice if d3-sankey's value accessor was configurable, to avoid creating the empty_links data structure in the code below.
forked from syntagmatic's block: Sankey Transitions
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js"></script> | |
| <script src="http://cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js"></script> | |
| <script src="http://cdnjs.cloudflare.com/ajax/libs/three.js/r67/three.min.js"></script> | |
| <script src="http://www.billdwhite.com/wordpress/wp-content/js/threejs/examples/js/controls/TrackballControls.js"></script> | |
| <script src="http://www.billdwhite.com/wordpress/wp-content/js/threejs/examples/js/controls/OrbitControls.js"></script> | |
| <script src="http://www.billdwhite.com/wordpress/wp-content/js/threejs/examples/js/renderers/CanvasRenderer.js"></script> | |
| <script src="http://www.billdwhite.com/wordpress/wp-content/js/threejs/examples/js/controls/TrackballControls.js"></script> |
| # d3 cloud example | |
| An example of how to animate a [d3-cloud](https://github.com/jasondavies/d3-cloud) word cloud. | |
| Based on https://github.com/jasondavies/d3-cloud/blob/master/examples/simple.html. |
| license: gpl-3.0 | |
| border: no | |
| height: 1060 |
| Click on any arc to zoom in. Click on the center circle to zoom out. | |
| A sunburst is similar to a treemap, except it uses a radial layout. The root node of the tree is at the center, with leaves on the circumference. The area (or angle, depending on implementation) of each arc corresponds to its value. Sunburst design by [John Stasko](http://www.cc.gatech.edu/gvu/ii/sunburst/). Data courtesy [Jeff Heer](http://flare.prefuse.org/). |
| I combined Mike Bostock's [Zoomable Sunburst](http://bl.ocks.org/mbostock/4348373) and [Sunburst Partition](http://bl.ocks.org/mbostock/4063423) examples, so that I could have both zooming and updating the underlying data (between count and size, in this case). A simple combination of the examples does not work; you have to edit the arcTween function used for updating the data, so that when it redraws the partition layout, it takes account of the current zoom level by adjusting the domain of the x scale. | |
| Click on any arc to zoom in, and click on the center circle to zoom out. Use the Size/Count radio buttons to update the data. |
Created by Christopher Manning
Draws a force directed graph using svg:path and geo projections onto a sphere.
| license: gpl-3.0 | |
| height: 960 |
This example demonstrates how to prevent D3’s force layout from moving nodes that have been repositioned by the user. When the force layout’s drag behavior dispatches a dragstart event, the fixed property of the dragged node is set to true. This prevents the force layout from subsequently changing the position of the node (due to forces). Double-click to release a node.
Internally, the force layout uses three bits to control whether a node is fixed. The first bit can be set externally, as in this example. The second and third bits are set on mouseover and mousedown, respectively, so that nodes are fixed temporarily during dragging. Although the second and third bits are automatically cleared when dragging ends, the first bit stays true in this example, and thus nodes remain fixed after dragging.
Also note that the force layout resumes au
This example demonstrates how to prevent D3’s force layout from moving nodes that have been repositioned by the user. When the force layout’s drag behavior dispatches a dragstart event, the fixed property of the dragged node is set to true. This prevents the force layout from subsequently changing the position of the node (due to forces). Double-click to release a node.
Internally, the force layout uses three bits to control whether a node is fixed. The first bit can be set externally, as in this example. The second and third bits are set on mouseover and mousedown, respectively, so that nodes are fixed temporarily during dragging. Although the second and third bits are automatically cleared when dragging ends, the first bit stays true in this example, and thus nodes remain fixed after dragging.
Also note that the force layout resumes au