Search results

Events

Using events in Linear Gauge component

In the following example, the event ValueChange binds to the linear gauge component, so the event handler UpdatePointerValue will be called when you drag the pointer and update the pointer value in the div element.

@using Syncfusion.EJ2.Blazor.LinearGauge

<div style="width:250px">
    <div style="text-align: center">@pointerValue</div>
    <EjsLinearGauge Height="250px">
        <LinearGaugeEvents ValueChange="@UpdatePointerValue"></LinearGaugeEvents>
        <LinearGaugeAxes>
            <LinearGaugeAxis>
                <LinearGaugePointers>
                    <LinearGaugePointer EnableDrag="true" Value="10"></LinearGaugePointer>
                </LinearGaugePointers>
            </LinearGaugeAxis>
        </LinearGaugeAxes>
    </EjsLinearGauge>
</div>

@code {
    private double pointerValue = 10;
    void UpdatePointerValue(IValueChangeEventArgs args)
    {
        pointerValue = args.Value;
    }
}

Bind event to linear gauge

Available events

AnimationCompleted

Description: Triggers, after animation is completed.

Argument name Description
Axis Specifies the axis instance
Pointer Specifies the pointer instance

AnnotationRendering

Description: Triggers, before rendering on each annotation. You can customize annotations using these arguments.

Argument name Description
Annotation Specifies the annotation instance
Content Specifies the annotation content
TextStyle To customize the text style

AxisLabelRendering

Description: Triggers, before rendering on each axis label. You can customize the labels using these arguments.

Argument name Description
Axis Specifies the axis instance
Text Specifies the text instance
Value Specifies the axis label, you can customize this

Loaded

Description: Triggers, after the gauge component has been loaded.

Argument name Description
Gauge Linear gauge instance

OnGaugeMouseDown

Description: Triggers, when you click the mouse on the gauge.

Argument name Description
Model Specifies the linear gauge instance
Target Defines current mouse event target id
X Defines the current mouse x location
Y Defines the current mouse y location

OnGaugeMouseLeave

Description: Triggers, when the mouse pointer is moved out of the gauge.

Argument name Description
Model Specifies the linear gauge instance
Target Defines current mouse event target id
X Define the current mouse x location
Y Define the current mouse y location

OnGaugeMouseMove

Description: Triggers on cursor moving on the gauge.

Argument name Description
Model Specifies the linear gauge instance
Target Defines current mouse event target id
X Define the gauge x value
Y Define the gauge Y value

OnGaugeMouseUp

Description: Triggers, when you releasing a mouse on the gauge.

Argument name Description
Model Specifies the linear gauge instance
Target Defines current mouse event target id
X Define the current mouse x location
Y Define the current mouse y location

OnLoad

Description: Triggers, before rendering the gauge. Gauge will trigger this event first.

Argument name Description
Gauge Linear gauge instance

Resizing

Description: Triggers, when you resize the gauges.

Argument name Description
CurrentSize Define the current size of the gauge
Gauge Linear gauge instance
Name Defines the name of the event
PreviousSize Define the previous size of the gauge

TooltipRendering

Description: Triggers, before rendering the gauge tooltip.

Argument name Description
Axis axis instance
Content Specifies the tooltip text
Event Specifies the mouse arguments
Gauge Linear gauge instance
Name Defines the name of the event
Location Specifies the tooltip location
Pointer Specifies the pointer instance
Tooltip To customize the tooltip settings

ValueChange

Description: Triggers, when we drag the gauge pointer value.

Argument name Description
Axis Axis Instance
AxisIndex Defines the axis index value
Gauge Linear gauge instance
Name Defines the name of the event
Pointer Specifies the pointer instance
PointerIndex Index of the current pointer instance
Value Specifies the current pointer value