Budget Pie Chart HTML Code
unknown
plain_text
2 years ago
1.3 kB
14
Indexable
<script type="text/javascript">
google.charts.load("current", {packages:["corechart"]});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Title', 'Value'],Current User's Budget:format as text
]);
var remainingBudget = Current User's Onboarding:each item's What is your estimated budget? (USD):first item - Current User's Budget:each item's Total Cost:sum;
data.addRow(['Remaining budget', Math.max(remainingBudget, 0)]);
var options = {
colors: [Current User's Budget:format as text, '#E8E3D9'],
animationStartup: 'true',
title: ' ',
pieHole: 0.5,
pieSliceTextStyle: {
color: 'black',
fontSize: '9',
},
pieSliceText: 'none',
tooltipIgnoreBounds: 'true',
tooltipText: 'value',
tooltipTrigger: 'focus',
tooltipTextStyle: {
color: 'black',
fontSize: '9',
},
pieStartAngle: '0',
legend: 'none',
animation: {"startup": true}
};
var chart = new google.visualization.PieChart(document.getElementById('donutchart1'));
chart.draw(data, options);
google.visualization.events.addListener(chart, 'select', function() {
});
}
</script>
<div id="donutchart1" style="width: 100%; height: 100%;"></div>Editor is loading...
Leave a Comment