Appearance
The Gauges enable you to set their width and height and customize their color.
Dimensions and Resizing
By default, the Gauges are rendered with a size of 200x200 px. To set a different size to the ArcGauge, use the style
attribute—for example, style="width: 100%; height: 100%;"
accommodates the component in the container element.
The LinearGauge and RadialGauge are inline
elements by default. In addition to specifying their width and height inline with the style
attribute, configure their display as block elements by applying the display: block;
CSS rule to the .k-gauge
class.
The components automatically resize and redraw their content when the size of their elements changes—for example, as a result of a browser window resizing. To limit the automatic resizing, use the resizeRateLimit
option of the Gauges. To disable the automatic resizing, set resizeRateLimit
to 0
.
Color
The colors of the Gauges are derived from the active Kendo UI theme. It is possible to customize them through the theme variables and the configuration.