Arc Gauge Labels
You can customize the appearance of the labels rendered on thescaleof the Arc Gauge by using the
Format
TheFormat(string) parameter allows you to customize the rendering of the labels by using thestandard numeric format strings. You can set the values of the labels to showcase, for example, currency, percentage, and so on.
Use the Format parameter to showcase percentage. The result from the code snippet below.
@* Use the {0:P0} format string to format the values of the labels as percentage. *@ Center Template
The center template allows you to take control of the rendering of the central section of the Arc Gauge. To use it, add thecontextobject (GaugeCenterLabelTemplateContext) which exposes a list with the pointer in the component.
Use the Center Template to display the Value of the pointer. The result from the code snippet below.
@* Print the value of the pointer in the center of the component *@ @{ var item = context; var pointer = context.Pointers.FirstOrDefault(); @pointer.Value } Color
TheColor(string) parameter controls the color of the labels. It acceptsCSS,HEXandRGBcolors.
Change the color of the labels. The result from the code snippet below.
@ *标签的颜色更改为红色* @ <电话ikArcGauge> Visible
TheVisible(bool) parameter controls wether the labels will be rendered. By default the labels would not be rendered.
Show the labels by using the Visible parameter. The result from the code snippet below
@* Set the Visible parameter to true to show the labels *@ Additional Customization
To further customize the elements of the Arc Gauge you can use nested tags. When configuring nested properties and child elements in your Arc Gauge, the inner tags will contain their parent tag name and add specifics to its end. In general the structure of such nested tags will be
- Scale
- GaugeArea
Customize the borders of the Labels. The result from the code snippet below.
@* Provide color, solid outline and custom width to the label borders *@