This question is about using the chart.js library in JavaScript. Here is the code snippet:
JAVASCRIPT
totalCost = (inputWatts * price + varServiceFees + inputServiceTrips).toFixed(0);
totalFactor = (totalCost / (inputWatts * price)).toFixed(2);
if (selected === 'bService') {
totalCostService = totalCost;
} else if (selected === 'bMicro') {
totalCostMicro = totalCost;
} else {
totalCostTypical = totalCost;
}
var data = [
{
value: totalCostService,
color: '#f7464a'
},
{
value: totalCostMicro,
color: '#46bfbd'
},
{
value: totalCostTypical,
color: '#fdb45c'
}
], graph = new Chart(document.getElementById('canvas').getContext('2d')).Doughnut(data);
The issue I am facing is that when using the totalCost variable, nothing happens. However, if I replace it with a number like 30, it works fine. The variable seems to be valid as it displays correctly on my webpage and isNaN === false. Any suggestions or assistance would be greatly appreciated. Thank you!
EDIT
While debugging, I replaced value: totalCostMicro and value: totalCostTypical with value: 30 and focused on totalCostService. As shown in the code, totalCostService equals the calculation of inputWatts * price etc. To troubleshoot, I tried value: inputWatts, which worked, and then tested with value: price and other variables successfully. However, the general variable totalCost doesn't seem to work, possibly due to the .toFixed(0) function used to round off the number. Are there any alternatives to achieve this?