Dependency startangle
by kzoon
HTML
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/sankey.js"></script>
<script src="https://code.highcharts.com/modules/dependency-wheel.js"></script>
<figure class="highcharts-figure">
<div id="container"></div>
</figure>
CSS
#container {
height: 500px;
}
JavaScript
Highcharts.chart('container', {
"chart": {
"reflow": false,
"type": "dependencywheel",
"animation": false,
"borderRadius": 0,
"backgroundColor": "rgba(255,255,255,1)",
"plotBackgroundColor": "rgba(255,255,255,0)",
"spacingBottom": 10,
"scAnimateChanges": false,
"scAllowHidingSeries": true,
"scHandleHideOnServer": false
},
"drilldown": {},
"title": {
"text": "",
"margin": 0
},
"subtitle": {
"text": "",
"margin": 0
},
/* "legend": {
"margin": 10,
"backgroundColor": "rgba(255,255,255,0)",
"borderWidth": 1,
"squareSymbol": false,
"symbolRadius": 0,
"itemStyle": {
"fontFamily": "'Lucida Grande', 'Lucida Sans Unicode'",
"fontSize": "11px",
"fontWeight": "normal",
"color": "rgba(102,102,102,1)"
}
},
*/
"tooltip": {
"enabled": true,
"style": {
"fontFamily": "'Lucida Grande', 'Lucida Sans Unicode'",
"fontSize": "11px",
"color": "rgba(102,102,102,1)"
},
"useHTML": true,
"hideDelay": 10,
"outside": true
},
"plotOptions": {
"dependencywheel": {
"size": "85%",
"startAngle": 180,
"animation": false,
"shadow": false,
"stickyTracking": false,
"dataLabels": {
textPath: {
enabled: true,
attributes: {
dy: 5 //Half of distance
}
},
distance: 10, //make dependent on fontsize
enabled: true,
//"enabled": false,
"borderColor": "rgba(0,0,0,1)",
"style": {
"fontFamily": "'Lucida Grande', 'Lucida Sans Unicode'",
"fontSize": "11px",
...