JavaScript UI Libraries & Blazor Components Suite – Smart UI › Forums › Gauge & Tank › Gauge with big range amplitude › Reply To: Gauge with big range amplitude
June 15, 2018 at 12:47 pm
#98889
Keymaster
Hi AL,
Please try using smart-gauge configured as follows:
<smart-gauge analog-display-type="fill"
digital-display
digital-display-position="center"
start-angle="0"
end-angle="180"
min="1"
max="500"
value="2"
logarithmic-scale
show-ranges
ranges='[{ "startValue": "1", "endValue": "20", "className": "calm" }, { "startValue": "200", "endValue": "500", "className": "danger" }]'></smart-gauge>
You can style the “calm” and “danger” zones as follows:
<style type="text/css">
.calm {
fill: darkseagreen;
}
.danger {
fill: crimson;
}
</style>
Best Regards,
Dimitar
Smart HTML Elements Team
https://www.htmlelements.com