This variation of a donut chart demonstrates how to add labels with lines. Clicking on the button changes the displayed data. Check Pie Chart with Labels and Missing Data to see how to handle transitions with missing/new data.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js"></script> | |
<title>Animated Drag And Drop</title> | |
</head> | |
<body> | |
<div id="viz"></div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<meta charset="utf-8"> | |
<style> | |
svg { | |
float: left; | |
border: solid 1px #aaa; | |
} | |
</style> | |
<script src="http://mbostock.github.com/d3/d3.js?2.7.1"></script> |
This is an example of small multiples with area charts.
This is an example of small multiples with bar charts. The bar chart is implemented with rect SVG element.
This is an example of small multiples with bar charts. The bar chart is implemented with a single path, not rect SVG element.
This is an example of small multiples with radial area charts.
This is an example to transit small multiples from area charts to bar charts. The bar charts are implemented with path, not rect SVG element.
This is an example to transit small multiples from area charts to bar charts. The bar charts are implemented with rect, not path SVG element.
Small multiples with brush
OlderNewer