20 lines
724 B
JavaScript
20 lines
724 B
JavaScript
// JavaScript
|
|
function updateGauge(value) {
|
|
const gaugeValue = document.getElementById('gaugeValue');
|
|
const maxGaugeValue = 100; // Maximum value the gauge can display
|
|
const rotationDegree = ((value / maxGaugeValue) * 180) - 90; // Convert value to degree (-90 to 90)
|
|
|
|
gaugeValue.style.transform = `rotate(${rotationDegree}deg)`;
|
|
|
|
// Change color based on value
|
|
if (value <= 40) {
|
|
gaugeValue.style.backgroundColor = 'green';
|
|
} else if (value <= 80) {
|
|
gaugeValue.style.backgroundColor = 'orange';
|
|
} else {
|
|
gaugeValue.style.backgroundColor = 'red';
|
|
}
|
|
}
|
|
|
|
// Example usage:
|
|
updateGauge(50); // Rotates the gauge to 0 degrees (50 out of 100) and changes color to orange
|