gaugeArea Object
The gauge area configuration options. This is the entire visible area of the gauge.
Example - set gaugeArea border width and color
<div id="gauge-container">
<div id="gauge"></div>
</div>
<script>
$(function() {
var value = $("#gauge-value").val();
$("#gauge").kendoLinearGauge({
pointer: {
value: 28
},
gaugeArea: {
border: {
color: "green",
width: "4px"
}
},
scale: {
majorUnit: 20,
minorUnit: 2,
min: -40,
max: 60,
vertical: true,
ranges: [
{
from: -40,
to: -20,
color: "#2798df"
}
]
}
});
});
</script>
<style>
#gauge-container {
text-align: center;
margin: 0 auto;
background-size: contain;
padding: 18px;
width: 300px;
height: 300px;
}
#gauge {
height: 100%;
display: inline-block;
*display: inline;
zoom: 1;
}
</style>