New to Telerik UI for ASP.NET Core? Download free 30-day trial

Linear Gauge Scale

The scale of the Telerik UI LinearGauge for ASP.NET Core renders the values, pointers and labels. It can be customized by adding the Scale option to the widget. The Scale exposes the following child options:

Min and Max

  • The Min (double) sets the lowest value of the widget.

  • The Max (double) sets the maximum value of the widget.

    @(Html.Kendo().LinearGauge()
          .Name("gauge")
          .Scale(scale => scale
              .Min(10)
              .Max(180)
          )
    )
    <kendo-lineargauge name="gauge">
        <scale min="10" max="180">
        </scale>
    </kendo-lineargauge>

MinorUnit and MajorUnit

  • The MajorUnit (double) parameter controls the interval between the major unit divisions of the widget. The values provided to the linear gauge's Pointer will render as a MajorUnit tick. The labels will be rendered next to the MajorUnit ticks.

  • The MinorUnit (double) parameter controls the interval between the minor unit divisions of the widget.

    @(Html.Kendo().LinearGauge()
          .Name("gauge")
          .Scale(scale => scale
              .MajorUnit(20)
              .MinorUnit(5)
          )
    )
    <kendo-lineargauge name="gauge">
        <scale major-unit="20" minor-unit="5">
        </scale>
    </kendo-lineargauge>

Mirror

By design, the labels and unit devisions of the Scale are rendered to the left, or, to the top if the gauge is horizontal. If you set the Mirror (bool) to true, the Scale will render the labels and unit devisions to the right or to the bottom, respectively.

    @(Html.Kendo().LinearGauge()
          .Name("gauge")
          .Scale(scale => scale
            .Mirror(true)
          )
    )
    <kendo-lineargauge name="gauge">
        <scale mirror="true">
        </scale>
    </kendo-lineargauge>

Reverse

If you set the Reverse (bool) option to true, the values of the scale will increase from top to bottom. By default they will raise from the bottom to the top.

    @(Html.Kendo().LinearGauge()
          .Name("gauge")
          .Scale(scale => scale
            .Reverse(true)
          )
    )
    <kendo-lineargauge name="gauge">
        <scale reverse="true">
        </scale>
    </kendo-lineargauge>

Vertical

By design, the default orientation of the widget is vertical. Setting the Vertical (bool) option to false would render the widget horizontally.

    @(Html.Kendo().LinearGauge()
          .Name("gauge")
          .Scale(scale => scale
            .Vertical(false)
          )
    )
    <kendo-lineargauge name="gauge">
        <scale vertical="false">
        </scale>
    </kendo-lineargauge>

See Also

In this article