| <!DOCTYPE html> | |
| <meta charset="utf-8"> | |
| <style> | |
| </style> | |
| <body> | |
| <button onClick="flip1();">Flip - Single Transition, Cubic-In-Out</button> | |
| <button onClick="flip2();">Flip - Double Transition, Cubic-Out, Cubic-In</button> | |
A visualization of the unfunded accrued actuarial pension liability for public pensions.
Data shown is for the Texas Teacher's Retirement System.
Visualization based on original by Mary Pat Campbell: http://www.actuarialoutpost.com/actuarial_discussion_forum/showthread.php?t=287451
| <html> | |
| <head> | |
| <script src="http://d3js.org/d3.v3.min.js"></script> | |
| <!-- <script src="http://www.jstat.org/jstat-1.0.0.min.js"></script> --> | |
| <!-- above source is down, need to build our own jstat (https://github.com/jstat/jstat), meanwhile, use unreliable mirror: --> | |
| <script src="jstat.min.js"></script> | |
| </head> | |
| <body> | |
| <div id="d3"></div> | |
| <script type="text/javascript"> |
An example of how to combine d3.behavior.drag and d3.behavior.zoom, using stopPropagation to allow the drag behavior to take precedence over panning. Use the mouse to pan by clicking on the background, or drag by clicking on individual dots; you may also use the mousewheel to zoom.
Note: combining these two behaviors means that gesture interpretation is ambiguous and highly sensitive to position. A click on a circle is interpreted as dragging that circle, whereas a click one pixel away could be interpreted as panning the background. A more robust method of combining these behaviors is to employ modality. For example, if the user holds down the SPACE key, clicking and dragging is interpreted as panning, rather than dragging, regardless of the click location. This approach is commonly employed in commercial software such as Adobe Photoshop.
This example was created in response to a [Stack Overflow quest
Built with blockbuilder.org
Recreation of wikipedia's gamma distribution plots in d3.
Powered using d3.js, jStat, and d3-legend.
Built with blockbuilder.org.
Recreation of wikipedia's gamma distribution plots in d3.
Powered using d3.js, jStat, and d3-legend.
Built with blockbuilder.org.
forked from SpaceActuary's block: Distributions
forked from SpaceActuary's block: Distributions 2
Built with blockbuilder.org
Visualization of non-negative distribution plots in d3.
Powered using d3.js, jStat, and d3-legend.
Built with blockbuilder.org.
forked from SpaceActuary's block: Distributions