<html>
<head></head>
<body>
<script src="https://d3js.org/d3.v4.min.js"></script>
<div id="pieChart"></div>
<script>
var pie = new d3pie("pieChart", {
"header": {
"title": {
"text": "Test",
"fontSize": 22,
"font": "verdana"
},
"subtitle": {
"text": "Test",
"color": "#999999",
"fontSize": 10,
"font": "verdana"
},
"titleSubtitlePadding": 12
},
"footer": {
"text": "Test",
"color": "#999999",
"fontSize": 11,
"font": "open sans",
"location": "bottom-center"
},
"size": {
"canvasHeight": 400,
"canvasWidth": 590,
"pieOuterRadius": "88%"
},
"data": {
"content": [
{
"label": "Test",
"value": 8,
"color": "#7e3838"
},
{
"label": "Test",
"value": 5,
"color": "#7e6538"
},
{
"label": "Test",
"value": 2,
"color": "#7c7e38"
},
{
"label": "Test",
"value": 3,
"color": "#587e38"
},
{
"label": "Test",
"value": 2,
"color": "#387e45"
},
{
"label": "Test",
"value": 1,
"color": "#387e6a"
},
{
"label": "Test",
"value": 3,
"color": "#386a7e"
}
]
},
"labels": {
"outer": {
"pieDistance": 32
},
"inner": {
"format": "value"
},
"mainLabel": {
"font": "verdana"
},
"percentage": {
"color": "#e1e1e1",
"font": "verdana",
"decimalPlaces": 0
},
"value": {
"color": "#e1e1e1",
"font": "verdana"
},
"lines": {
"enabled": true,
"color": "#cccccc"
},
"truncation": {
"enabled": true
}
},
"effects": {
"pullOutSegmentOnClick": {
"effect": "linear",
"speed": 400,
"size": 8
}
}
});
</script>
</body>
</html>
|