Files
controls-web/OLD/controlsdev/charts/canvasjs/examples/06-doughnut-chart/doughnut-chart-with-explode-on-click-disabled.html
2026-02-17 09:29:34 -06:00

38 lines
937 B
HTML

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
window.onload = function () {
var chart = new CanvasJS.Chart("chartContainer",
{
title:{
text: "Presidential Election Results"
},
animationEnabled: true,
data: [
{
type: "doughnut",
startAngle: 60,
toolTipContent: "{legendText}: {y} - <strong>#percent% </strong>",
showInLegend: true,
explodeOnClick: false, //**Change it to true
dataPoints: [
{y: 65899660, indexLabel: "Barack Obama #percent%", legendText: "Barack Obama" },
{y: 60929152, indexLabel: "Mitt Romney #percent%", legendText: "Mitt Romney" },
{y: 2175850, indexLabel: "Others #percent%", legendText: "Others" }
]
}
]
});
chart.render();
}
</script>
<script src="../../canvasjs.min.js"></script>
<title>CanvasJS Example</title>
</head>
<body>
<div id="chartContainer" style="height: 400px; width: 100%;"></div>
</body>
</html>