Contents
- Linear gauge dimensions
- Line customizaton
- Ticks
- Labels
- Axis
- Ranges
- Bar Pointer
- Marker Pointer
- Annotation
- Tooltip
- Appearence of Linear Gauge
- Gauge Container type
- Events
Having trouble getting help?
Contact Support
Contact Support
Migration from Essential® JS 1
8 Dec 202424 minutes to read
This article describes the API migration process of Accordion component from Essential® JS 1 to Essential® JS 2.
Linear gauge dimensions
| Behavior | API in Essential® JS 1 | API in Essential® JS 2 |
|---|---|---|
| Height |
Property: height<ej-linear-gauge id="gauge" height='150'></ej-linear-gauge>
|
Property: height<ejs-lineargauge id="gauge" height="150px"></ejs-lineargauge>
|
| Width |
Property: width<ej-linear-gauge id="gauge" width=200></ej-linear-gauge>
|
Property: width<ejs-lineargauge id="gauge" width='200px'></ejs-lineargauge>
|
| Height(In Percentage) | Not Applicable |
Property: height<ejs-lineargauge id="gauge" height='70%'></ejs-lineargauge>
|
| Width(In Percentage) | Not Applicable |
Property: width<ejs-lineargauge id="gauge" width='100%'></ejs-lineargauge>
|
Line customizaton
| Behavior | API in Essential® JS 1 | API in Essential® JS 2 |
|---|---|---|
| Height |
Property: scales.length<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales length="300"></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.line.height<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-line height="150"></e-axis-line></e-lineargauge-axis><e-lineargauge-axes></ejs-lineargauge>
|
| Width |
Property: scales.width<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales width="300"></e-linear-scales><e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.line.width<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-line width= 2></e-axis-line></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Color |
Property: scales.backgroundColor<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales background-color="blue"></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.line.color<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-line color='blue'></e-axis-line></e-lineargauge-axis><e-lineargauge-axes></ejs-lineargauge>
|
| Offset | Not Applicable |
Property: axes.line.offset<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-line offset=2></e-axis-line></e-lineargauge-axis><e-lineargauge-axes></ejs-lineargauge>
|
| Opacity |
Property: scales.opacity<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales opacity =0.2></e-linear-scales><e-linear-scale-collections></ej-linear-gauge>
|
Not Applicable |
| DashArray | Not Applicable |
Property: axes.line.dashArray<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-line dasharray =1></e-axis-line></e-lineargauge-axis><e-lineargauge-axes></ejs-lineargauge>
|
Ticks
| Behavior | API in Essential® JS 1 | API in Essential® JS 2 |
|---|---|---|
| Type of Ticks |
Property: scales.ticks.type<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-tick-collections><e-linear-ticks type="@TickType.MajorInterval"></e-linear-ticks></e-linear-tick-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.majorTicks.height<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis> <e-axis-majorticks></e-axis-majorticks></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Height of Major Ticks |
Property: scales.ticks.height<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-tick-collections><e-linear-ticks type="@TickType.MajorInterval" height='8'></e-linear-ticks></e-linear-tick-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.majorTicks.height<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis> <e-axis-majorticks height="8"></e-axis-majorticks></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Width of Major Ticks |
Property: scales.ticks.width<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-tick-collections><e-linear-ticks type="@TickType.MajorInterval" width='5'></e-linear-ticks></e-linear-tick-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.majorTicks.width<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis> <e-axis-majorticks width='5'></e-axis-majorticks></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Color of Major Ticks |
Property: scales.ticks.color<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-tick-collections><e-linear-ticks type="@TickType.MajorInterval" color='blue'></e-linear-ticks></e-linear-tick-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.majorTicks.color<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis> <e-axis-majorticks color='blue'></e-axis-majorticks></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Offset for Major Ticks |
Property: scales.ticks.distanceFromScale<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-tick-collections><e-linear-ticks type="@TickType.MajorInterval" ><e-distance-from-scale x="5" y="5"></e-distance-from-scale></e-linear-ticks></e-linear-tick-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.majorTicks.offset<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis> <e-axis-majorticks offset ='2'></e-axis-majorticks></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Interval of Major Ticks |
Property: scales.majorIntervalValue<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales major-interval-value="15"></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.majorTicks.interval<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis> <e-axis-majorticks interval='15'></e-axis-majorticks></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Angle of Major Ticks |
Property: scales.ticks.angle<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-tick-collections><e-linear-ticks type="@TickType.MajorInterval" angle='30'></e-linear-ticks></e-linear-tick-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Not Applicable |
| Opcity of Major Ticks |
Property: scales.ticks.opacity<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-tick-collections><e-linear-ticks type="@TickType.MajorInterval" opacity='0.2'></e-linear-ticks></e-linear-tick-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Not Applicable |
| Height of Minor Ticks |
Property: scales.ticks.height<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-tick-collections><e-linear-ticks type="@TickType.MinorInterval" height='8'></e-linear-ticks></e-linear-tick-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.minorTicks.height<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis> <e-axis-minorticks height="8"></e-axis-minorticks></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Width of Minor Ticks |
Property: scales.ticks.width<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-tick-collections><e-linear-ticks type="@TickType.MinorInterval" width='5'></e-linear-ticks></e-linear-tick-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.minorTicks.width<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis> <e-axis-minorticks width='5'></e-axis-minorticks></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Color of Minor Ticks |
Property: scales.ticks.color<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-tick-collections><e-linear-ticks type="@TickType.MinorInterval" color='blue'></e-linear-ticks></e-linear-tick-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.minorTicks.color<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis> <e-axis-minorticks color='blue'></e-axis-minorticks></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Offset for Minor Ticks |
Property: scales.ticks.distanceFromScale<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-tick-collections><e-linear-ticks type="@TickType.MinorInterval" ><e-distance-from-scale x="5" y="5"></e-distance-from-scale></e-linear-ticks></e-linear-tick-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.minorTicks.offset<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis> <e-axis-minorticks offset ='2'></e-axis-minorticks></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Interval of Minor Ticks |
Property: scales.minorIntervalValue<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales major-interval-value="15"></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.minorTicks.interval<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis> <e-axis-minorticks interval='15'></e-axis-minorticks></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Angle of Minor Ticks |
Property: scales.ticks.angle<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-tick-collections><e-linear-ticks type="@TickType.MinorInterval" angle='30'></e-linear-ticks></e-linear-tick-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Not Applicable |
| Opcity of Minor Ticks |
Property: scales.ticks.opacity<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-tick-collections><e-linear-ticks type="@TickType.MinorInterval" opacity='0.2'></e-linear-ticks></e-linear-tick-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Not Applicable |
Labels
| Behavior | API in Essential® JS 1 | API in Essential® JS 2 |
|---|---|---|
| Angle |
Property: scales.labels.angle<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-label-collections><e-linear-labels angle="15"></e-linear-labels></e-linear-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Not Applicable |
| Offset |
Property: scales.labels.distanceFromScale<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-label-collections><e-linear-labels><e-distance-from-scale x="-5" y="10"></e-distance-from-scale></e-linear-labels></e-linear-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.labelStyle.offset<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-labelstyle offset="2"></e-axis-labelstyle></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Format |
Property: scales.labels.unitText<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-label-collections><e-linear-labels unit-text="F"></e-linear-labels></e-linear-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.labelStyle.format<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-labelstyle format="c"></e-axis-labelstyle></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Unit Text Placement |
Property: scales.labels.unitTextPlacement<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-label-collections><e-linear-labels unit-text-placement="Front"></e-linear-labels></e-linear-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Not Applicable |
| Label Range Color | Not Applicable |
Property: axes.labelStyle.useRangeColor<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-labelstyle useRangeColor="true"></e-axis-labelstyle></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Opacity |
Property: scales.labels.opacity<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-label-collections><e-linear-labels opacity="0.5"></e-linear-labels></e-linear-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.labelStyle.font.opacity<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-labelstyle font="fontstyle"><e-axis-labelstyle-font ></e-axis-labelstyle-font></e-axis-labelstyle></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge></br></br>var fontstyle = new { opacity = 0.5 };
|
| Label Text Color |
Property: scales.labels.textColor<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-label-collections><e-linear-labels text-color="Red"></e-linear-labels></e-linear-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.labelStyle.font.color<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-labelstyle font="fontstyle"><e-axis-labelstyle-font ></e-axis-labelstyle-font></e-axis-labelstyle></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge></br></br>var fontstyle = new { color= 'red' };
|
| Label Font Family |
Property: scales.labels.font.fontFamily<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-label-collections><e-linear-labels><e-font font-family="SegoeUI"></e-font></e-linear-labels></e-linear-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.labelStyle.font.fontFamily<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-labelstyle font="fontstyle"><e-axis-labelstyle-font></e-axis-labelstyle-font></e-axis-labelstyle></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge></br></br>var fontstyle = new { fontFamily: 'Arial' };
|
| Label Font Style |
Property: scales.labels.font.fontStyle<ej-linear-gaugeid="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-label-collections><e-linear-labels><e-font font-style="ej.datavisualization.LinearGauge.FontStyle.Normal"></e-font></e-linear-labels></e-linear-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.labelStyle.font.fontStyle<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-labelstyle font="fontstyle"><e-axis-labelstyle-font ></e-axis-labelstyle-font></e-axis-labelstyle></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge></br></br>var fontstyle = new { fontStyle= 'Bold' };
|
| Label Size |
Property: scales.labels.font.size<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-label-collections><e-linear-labels><e-font size="20px"></e-font></e-linear-labels></e-linear-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.labelStyle.font.size<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-labelstyle font="fontstyle"><e-axis-labelstyle-font ></e-axis-labelstyle-font></e-axis-labelstyle></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge></br></br>var fontstyle = new { size= "15px" };
|
| Label Font Weight | Not Applicable |
Property: axes.labelStyle.font.fontWeight <ejs-lineargauge id="gauge"><e-lineargauge-axes> <e-lineargauge-axis><e-axis-labelstyle font="fontstyle"><e-axis-labelstyle-font ></e-axis-labelstyle-font></e-axis-labelstyle></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge></br></br>var fontstyle = new { fontWeight= '4' };
|
Axis
| Behavior | API in Essential® JS 1 | API in Essential® JS 2 |
|---|---|---|
| Minimum Value |
Property: scales.minimum<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales minimum="20"></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.minimum<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis minimum="20"></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Maximum Value |
Property: scales.maximum<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales maximum="20"></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.maximum<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis maximum="20"></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Inverted Position | Not Applicable |
Property: axes.isInversed<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis maximum="20"></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Opposed Position | Not Applicable |
Property: axes.opposedPosition<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis opposedPosition="true" ></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
Ranges
| Behavior | API in Essential® JS 1 | API in Essential® JS 2 |
|---|---|---|
| Start Value |
Property: scales.ranges.startValue<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-range-collections><e-linear-ranges start-value="20"></e-linear-ranges></e-linear-range-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.ranges.start<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-axis-ranges><e-axis-range start="20"></e-axis-range></e-axis-ranges></e-lineargauge-axes></ejs-lineargauge>
|
| End Value |
Property: scales.ranges.endValue<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-range-collections><e-linear-ranges end-value="20"></e-linear-ranges></e-linear-range-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.ranges.end<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-axis-ranges><e-axis-range end="20"></e-axis-range></e-axis-ranges></e-lineargauge-axes></ejs-lineargauge>
|
| Start Width |
Property: scales.ranges.startWidth<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-range-collections><e-linear-ranges start-width="20"></e-linear-ranges></e-linear-range-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.ranges.startWidth<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-axis-ranges><e-axis-range startWidth="20"></e-axis-range></e-axis-ranges></e-lineargauge-axes></ejs-lineargauge>
|
| End Width |
Property: scales.ranges.endWidth <ej-linear-gauge id="gauge"> <e-linear-scale-collections><e-linear-scales><e-linear-range-collections><e-linear-ranges end-width="20"></e-linear-ranges></e-linear-range-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.ranges.endWidth<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-axis-ranges><e-axis-range endWidth="20"></e-axis-range></e-axis-ranges></e-lineargauge-axes></ejs-lineargauge>
|
| Color |
Property: scales.ranges.backgroundColor<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-range-collections><e-linear-ranges range-background-color="red"></e-linear-ranges></e-linear-range-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.ranges.color<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-axis-ranges><e-axis-range color="red"></e-axis-range></e-axis-ranges></e-lineargauge-axes></ejs-lineargauge>
|
| Offset |
Property: scales.ranges.distanceFromScale<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-range-collections><e-linear-ranges distance-from-scale="10" ></e-linear-ranges></e-linear-range-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.ranges.offset<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-axis-ranges><e-axis-range offset="5"></e-axis-range></e-axis-ranges></e-lineargauge-axes></ejs-lineargauge>
|
| Range Position |
Property: scales.ranges.placement<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-range-collections><e-linear-ranges placement="Near" ></e-linear-ranges></e-linear-range-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.ranges.position<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-axis-ranges><e-axis-range position="Inside"></e-axis-range></e-axis-ranges></e-lineargauge-axes></ejs-lineargauge>
|
| Opacity |
Property: scales.ranges.opacity<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-axis-ranges><e-axis-range position="Inside"></e-axis-range></e-axis-ranges></e-lineargauge-axes></ejs-lineargauge>
|
Not Applicable |
| Border Customization |
Property: scales.ranges.border<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-linear-range-collections><e-linear-ranges><e-border color="green" width="2"></e-linear-ranges> </e-linear-range-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.ranges.border<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-axis-ranges><e-axis-range border="border"></e-axis-range> </e-axis-ranges> </e-lineargauge-axes></ejs-lineargauge></br></br>var border = new { color='green', width="2"};
|
Bar Pointer
| Behavior | API in Essential® JS 1 | API in Essential® JS 2 |
|---|---|---|
| Bar Pointer |
Property: scales.ranges.barPointers.value<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-bar-pointer-collections><e-bar-pointers bar-pointer-value="20"></e-bar-pointers></e-bar-pointer-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.pointers.value<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="RangeBar" value="20"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Color of Bar Pointer |
Property: scales.ranges.barPointers.backgroundColor<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-bar-pointer-collections><e-bar-pointers bar-pointer-value="20" bar-pointer-background-color="red"></e-bar-pointers></e-bar-pointer-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.pointers.color<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="RangeBar" value="20" color="red"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Offset of Bar Pointer |
Property: scales.ranges.barPointers.distanceFromScale<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-bar-pointer-collections><e-bar-pointers bar-pointer-value="20" bar-pointerdistance-from-scale="20"></e-bar-pointers></e-bar-pointer-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.pointers.offset<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="RangeBar" offset="20" value="20"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Opacity of Bar Pointer |
Property: scales.ranges.barPointers.opacity<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-bar-pointer-collections><e-bar-pointers bar-pointer-value="20" bar-pointer-opacity="0.5"></e-bar-pointers></e-bar-pointer-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.pointers.opacity<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="RangeBar" opacity="0.5" value="20"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Width of Bar Pointer |
Property: scales.ranges.barPointers.width<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-bar-pointer-collections><e-bar-pointers bar-pointer-value="20" width="2"></e-bar-pointers></e-bar-pointer-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.pointers.width<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="RangeBar" width="2" value="20"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Gradients of Bar Pointer |
Property: scales.ranges.barPointers.gradients<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-bar-pointer-collections><e-bar-pointers><e-gradients><e-color-info color-stop="0" color="#FFFFFF"></e-color-info></e-gradients></e-bar-pointers></e-bar-pointer-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Not Applicable |
| Border of Bar Pointer |
Property: scales.ranges.barPointers.border<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-bar-pointer-collections><e-bar-pointers><e-border color="red" width="2"></e-border></e-bar-pointers></e-bar-pointer-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.pointers.border<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="RangeBar"value="20" border="border"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge></br></br>var border = new { color="red" width="2" };
|
| Animation of Bar Pointer |
Property: enableAnimation<ej-linear-gauge id="gauge" enable-animation="true"></ej-linear-gauge>
|
Property: axes.pointers.animationDuration<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="RangeBar"value="20" animation="true" animationDuration="1000"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Rounded Corner of Bar Pointer | Not Applicable |
Property: axes.pointers.roundedCornerRadius<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="RangeBar"value="20" roundedCornerRadius="10"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
Marker Pointer
| Behavior | API in Essential® JS 1 | API in Essential® JS 2 |
|---|---|---|
| Marker Pointer |
Property: scales.ranges.markerPointers.value<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-marker-pointer-collections><e-marker-pointers value="20"></e-marker-pointers></e-marker-pointer-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.pointers.value<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="Marker" value="20"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Color of Marker Pointer |
Property: scales.ranges.markerPointers.backgroundColor<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-marker-pointer-collections><e-marker-pointers value="20" bar-pointer-background-color="red"></e-marker-pointers></e-marker-pointer-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.pointers.color<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="Marker" value="20" color="red"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Offset of Marker Pointer |
Property: scales.ranges.markerPointers.distanceFromScale<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-marker-pointer-collections><e-marker-pointers value="20" bar-pointerdistance-from-scale="20"></e-marker-pointers></e-marker-pointer-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.pointers.offset<ejs-lineargaugeid="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="Marker" offset="20" value="20"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Opacity of Marker Pointer |
Property: scales.ranges.markerPointers.opacity<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-marker-pointer-collections><e-marker-pointers value="20" bar-pointer-opacity="0.5"></e-marker-pointers></e-marker-pointer-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.pointers.opacity<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="Marker" opacity="0.5" value="20"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Width of Marker Pointer |
Property: scales.ranges.markerPointers.width<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-marker-pointer-collections><e-marker-pointers value="20" width="2"></e-marker-pointers></e-marker-pointer-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.pointers.width<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="Marker" width="2" value="20"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Gradients of Marker Pointer |
Property: scales.ranges.markerPointers.gradients<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-marker-pointer-collections><e-marker-pointers><e-gradients><e-color-info color-stop="0" color="#FFFFFF"></e-color-info></e-gradients></e-marker-pointers></e-marker-pointer-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Not Applicable |
| Border of Marker Pointer |
Property: scales.ranges.markerPointers.border<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-marker-pointer-collections><e-marker-pointers><e-border color="red" width="2"></e-border></e-marker-pointers></e-marker-pointer-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.pointers.border<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="Marker"value="20" border="border"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge></br></br>var border = new { color="red" width="2" };
|
| Animation of Marker Pointer |
Property: enableMarkerPointerAnimation<ej-linear-gauge id="gauge" enable-animation="true"></ej-linear-gauge>
|
Property: axes.pointers.animationDuration<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="Marker"value="20" animation="true" animationDuration="1000"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Type of Marker Pointer |
Property: scales.ranges.markerPointers.type<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales><e-marker-pointer-collections><e-marker-pointers type="@MarkerType.Diamond" ><e-border color="red" width="2"></e-border></e-marker-pointers></e-marker-pointer-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: axes.pointers.markerType<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="Marker" markerType="Diamond" value="20" oundedCornerRadius="10"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Placement of Marker Pointer |
Property: scales.ranges.markerPointers.placement<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="Marker" value="20" placement="Near"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
Property: axes.pointers.placement<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="Marker" value="20" placement="Near"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Drag of Marker Pointer |
Property: readOnly<ej-linear-gauge id="gauge" read-only="true"></ej-linear-gauge>
|
Property: axes.pointers.enableDrag<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="Marker" value="20" enableDrag="true"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
| Image Marker Pointer | Not Applicable |
Property: axes.pointers.imageUrl<ejs-lineargauge id="gauge"><e-lineargauge-axes><e-lineargauge-axis><e-axis-pointers><e-axis-pointer type="Marker" value="20" imageUrl="a.png"enableDrag="true"></e-axis-pointer></e-axis-pointers></e-lineargauge-axis></e-lineargauge-axes></ejs-lineargauge>
|
Annotation
| Behavior | API in Essential® JS 1 | API in Essential® JS 2 |
|---|---|---|
| Content |
Property: scales.customLabels.value<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales show-custom-labels="true"><e-linear-custom-label-collections><e-linear-custom-labels value="LinearGauge"></e-linear-custom-labels></e-linear-custom-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: annotations.content<ejs-lineargauge id="gauge"><e-lineargauge-annotations><e-lineargauge-annotation content="Annotation"></e-lineargauge-annotation></e-lineargauge-annotations></ejs-lineargauge>
|
| Horizontal Alignment | Not Applicable |
Property: annotations.horizontalAlignment<ejs-lineargauge id="gauge"><e-lineargauge-annotations><e-lineargauge-annotation content="Annotation" horizontalAlignment="Center"></e-lineargauge-annotation></e-lineargauge-annotations></ejs-lineargauge>
|
| Vertical Alignment | Not Applicable |
Property: annotations.verticalAlignment<ejs-lineargauge id="gauge"><e-lineargauge-annotations><e-lineargauge-annotation content="Annotation" verticalAlignment="Center"></e-lineargauge-annotation></e-lineargauge-annotations></ejs-lineargauge>
|
| Position of X |
Property: scales.customLabels.position.x<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales show-custom-labels="true"><e-linear-custom-label-collections><e-linear-custom-labels value="LinearGauge"><e-linear-position x="20"></e-linear-position></e-linear-custom-labels></e-linear-custom-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: annotations.x<ejs-lineargauge id="gauge"><e-lineargauge-annotations><e-lineargauge-annotation content="Annotation" x="35"></e-lineargauge-annotation></e-lineargauge-annotations></ejs-lineargauge>
|
| Position of Y |
Property: scales.customLabels.position.y<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales show-custom-labels="true"><e-linear-custom-label-collections><e-linear-custom-labels value="LinearGauge"><e-linear-position y="20"></e-linear-position></e-linear-custom-labels></e-linear-custom-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: annotations.y<ejs-lineargauge id="gauge"><e-lineargauge-annotations><e-lineargauge-annotation content="Annotation" y="35"></e-lineargauge-annotation></e-lineargauge-annotations></ejs-lineargauge>
|
| Z Index | Not Applicable |
Property: annotations.zIndex<ejs-lineargauge id="gauge"><e-lineargauge-annotations><e-lineargauge-annotation content="Annotation" zIndex="1"></e-lineargauge-annotation></e-lineargauge-annotations></ejs-lineargauge>
|
| Axis Index | Not Applicable |
Property: annotations.axisIndex<ejs-lineargauge id="gauge"><e-lineargauge-annotations><e-lineargauge-annotation content="Annotation" axisIndex="0"></e-lineargauge-annotation></e-lineargauge-annotations></ejs-lineargauge>
|
| Axis Value | Not Applicable |
Property: annotations.axisValue<ejs-lineargauge id="gauge"><e-lineargauge-annotations><e-lineargauge-annotation content="Annotation" axisValue="35"></e-lineargauge-annotation></e-lineargauge-annotations></ejs-lineargauge>
|
| Font customization |
Property: scales.customLabels.font<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales show-custom-labels="true"><e-linear-custom-label-collections><e-linear-custom-labels value="LinearGauge"><e-font size="15px"></e-font></e-linear-custom-labels></e-linear-custom-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: annotations.font<ejs-lineargauge id="gauge"><e-lineargauge-annotations><e-lineargauge-annotation content="Annotation" font='font'></e-lineargauge-annotation></e-lineargauge-annotations></ejs-lineargauge></br></br>var font =new {size='12px'}
|
| Annotation Color |
Property: scales.customLabels.color<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales show-custom-labels="true"><e-linear-custom-label-collections><e-linear-custom-labels value="LinearGauge" color="red"></e-font></e-linear-custom-labels></e-linear-custom-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: annotations.font<ejs-lineargauge id="gauge"><e-lineargauge-annotations><e-lineargauge-annotation content="Annotation" font='font'></e-lineargauge-annotation></e-lineargauge-annotations></ejs-lineargauge></br></br>var font =new {color ="red"}
|
| Opacity of Annotation |
Property: scales.customLabels.opacity<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales show-custom-labels="true"><e-linear-custom-label-collections><e-linear-custom-labels opacity="0.4" value="LinearGauge"></e-linear-custom-labels></e-linear-custom-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: annotations.font<ejs-lineargauge id="gauge"><e-lineargauge-annotations><e-lineargauge-annotation content="Annotation" font='font'></e-lineargauge-annotation></e-lineargauge-annotations></ejs-lineargauge></br></br>var font =new {opacity ="0.4"}
|
| Position Type |
Property: scales.customLabels.positionType<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales show-custom-labels="true"><e-linear-custom-label-collections><e-linear-custom-labels value="LinearGauge" custom-label-position-type="Outer"></e-linear-custom-labels></e-linear-custom-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Not applicable |
| TextAngle of Annotation |
Property: scales.customLabels.textAngle<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales show-custom-labels="true"><e-linear-custom-label-collections><e-linear-custom-labels value="LinearGauge" text-angle="25"></e-linear-custom-labels></e-linear-custom-label-collections></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Not applicable |
Tooltip
| Behavior | API in Essential® JS 1 | API in Essential® JS 2 |
|---|---|---|
| Tooltip for Pointer | Not Applicable |
Property: tooltip.enable<ejs-lineargauge id="gauge"> <e-lineargauge-tooltip enable="true"></e-lineargauge-tooltip></ejs-lineargauge>
|
| Tooltip for Label |
Property: tooltip.showLabelTooltip<ej-linear-gauge id="gauge"><e-linear-tooltip show-label-tooltip="true"></e-linear-tooltip> </ej-linear-gauge>
|
Not Applicable |
| Tooltip Format | Not Applicable |
Property: tooltip.format<ejs-lineargauge id="gauge"> <e-lineargauge-tooltip enable="true" format: ${pointers.value}cm></e-lineargauge-tooltip></ejs-lineargauge>
|
| Tooltip Color | Not Applicable |
Property: tooltip.fill<ejs-lineargauge id="gauge"> <e-lineargauge-tooltip enable="true" fill="grey"></e-lineargauge-tooltip></ejs-lineargauge>
|
| Tooltip Template |
Property: tooltip.templateID<ej-linear-gauge id="gauge"><e-linear-tooltip show-label-tooltip="true" template-id="true"></e-linear-tooltip> </ej-linear-gauge>
|
Property: tooltip.template<ejs-lineargauge id="gauge"> <e-lineargauge-tooltip enable="true" template='template'></e-lineargauge-tooltip></ejs-lineargauge>
|
| Tooltip Animation | Not Applicable |
Property: tooltip.enableAnimation<ejs-lineargauge id="gauge"> <e-lineargauge-tooltip enableAnimation="true"></e-lineargauge-tooltip></ejs-lineargauge>
|
| Tooltip Border | Not Applicable |
Property: tooltip.border<ejs-lineargauge id="gauge"> <e-lineargauge-tooltip enableAnimation="true" border="border"></e-lineargauge-tooltip></ejs-lineargauge> </br></br>var border = new {width: 2, color: 'red'}
|
| Tooltip TextStyle | Not Applicable |
Property: tooltip.textStyle<ejs-lineargauge id="gauge"> <e-lineargauge-tooltip enableAnimation="true" border="border"></e-lineargauge-tooltip></ejs-lineargauge> var border = new {color: 'white', size: '10px'}
|
Appearence of Linear Gauge
| Behavior | API in Essential® JS 1 | API in Essential® JS 2 |
|---|---|---|
| Background Color |
Property: backgroundColor<ej-linear-gauge id="gauge" background-color="red"> </ej-linear-gauge>
|
Property: background<ejs-lineargauge id="gauge" background="red"></ejs-lineargauge>
|
| Border Color |
Property: borderColor<ej-linear-gauge id="gauge" border-color="blue"> </ej-linear-gauge>
|
Property: border.color<ejs-lineargauge id="gauge" border="border"></ejs-lineargauge></br> var border= new {color="red"}
|
| Margin | Not Applicable |
Property: margin<ejs-lineargauge id="gauge" margin="margin"></ejs-lineargauge></br> var margin= new {left: 40, right: 40, top: 40, bottom: 40}
|
| Orientation |
Property: orientation<ej-linear-gauge id="gauge" orientation="Vertical"> </ej-linear-gauge>
|
Property: orientation<ejs-lineargauge id="gauge" orientation="Vertical"></ejs-lineargauge>
|
| Locale |
Property: locale<ej-linear-gauge id="gauge" locale="en-US"> </ej-linear-gauge>
|
Property: locale<ejs-lineargauge id="gauge" locale="en-US"></ejs-lineargauge>
|
| Theme |
Property: theme<ej-linear-gauge id="gauge" theme="saffron"> </ej-linear-gauge>
|
Property: theme<ejs-lineargauge id="gauge" theme="Material"></ejs-lineargauge>
|
| Gauge Title | Not Applicable |
Property: title<ejs-lineargauge id="gauge" title="LinearGauge"></ejs-lineargauge>
|
Gauge Container type
| Behavior | API in Essential® JS 1 | API in Essential® JS 2 |
|---|---|---|
| Container Type |
Property: scales.type<ej-linear-gauge id="gauge"><e-linear-scale-collections><e-linear-scales type="Thermometer" ></e-linear-scales></e-linear-scale-collections></ej-linear-gauge>
|
Property: container.type<ejs-lineargauge id="gauge"><e-lineargauge-container type="Thermometer"></e-lineargauge-container></ejs-lineargauge>
|
| Container Height | Not Applicable |
Property: container.height<ejs-lineargauge id="gauge"><e-lineargauge-container type="Thermometer"height="20"></e-lineargauge-container></ejs-lineargauge>
|
| Container Width | Not Applicable |
Property: container.width<ejs-lineargauge id="gauge"><e-lineargauge-container type="Thermometer"width="10"></e-lineargauge-container></ejs-lineargauge>
|
| Container Offset | Not Applicable |
Property: container.offset<ejs-lineargauge id="gauge"><e-lineargauge-container type="Thermometer"offset="5"></e-lineargauge-container></ejs-lineargauge>
|
Events
| Behavior | API in Essential® JS 1 | API in Essential® JS 2 |
|---|---|---|
| Animation Complete Event | Not Applicable |
Event: animationComplete<ejs-lineargauge id="gauge" animationComplete="animationComplete"></ejs-lineargauge></br> function animationComplete(args){}
|
| Annotation Render Event |
Event: drawCustomLabel<ej-lineargauge id="gauge" draw-custom-label="customLabel"></ej-lineargauge></br> function customLabel(args){}
|
Event: annotationRender<ejs-lineargauge id="gauge" annotationRender="annotationRender"></ejs-lineargauge></br> function annotationRender(args){}
|
| AxisLabel Render Event |
Event: drawLabels<ej-lineargauge id="gauge" draw-labels="labels"></ej-lineargauge></br>function labels(args){}
|
Event: axisLabelRender<ejs-lineargauge id="gauge" axisLabelRender="axisLabelRender"></ejs-lineargauge></br>function axisLabelRender(args){}
|
| Load Event |
Event: load<ej-lineargauge id="gauge" load="load"></ej-lineargauge></br> function load(args){}
|
Event: load<ejs-lineargauge id="gauge" load="load"></ejs-lineargauge></br> function load(args){}
|
| Loaded Event | Not Applicable |
Event: loaded<ejs-lineargauge id="gauge" loaded="load"></ejs-lineargauge></br> function load(args){}
|
| Resize Event | Not Applicable |
Event: resized<ejs-lineargauge id="gauge" resized="resized"></ejs-lineargauge></br> function resized(args){}
|
| Tooltip Render Event | Not Applicable |
Event: tooltipRender<ejs-lineargauge id="gauge" tooltipRender="tooltipRender"></ejs-lineargauge></br> function tooltipRender(args){}
|
| Value Change Event | Not Applicable |
Event: valueChange<ejs-lineargauge id="gauge" valueChange="valueChange"></ejs-lineargauge> </br>function valueChange(args){}
|
| Mouse Move Event |
Event: mouseClickMove<ej-linear-gauge id="gauge" mouse-click-move="mouseclick"></ej-linear-gauge></br>function mouseclick(args){}
|
Event: gaugeMouseMove<ejs-lineargauge id="gauge" gaugeMouseMove="gaugeMouseMove"></ejs-lineargauge> </br>function gaugeMouseMove(args){}
|
| Mouse Up Event |
Event: mouseClickUp<ej-linear-gauge id="gauge" mouse-click-up="mouseclick"></ej-linear-gauge></br>function gaugeMouseUp(args){}
|
Event: gaugeMouseUp<ejs-lineargauge id="gauge" gaugeMouseUp="gaugeMouseUp"></ejs-lineargauge> </br>function gaugeMouseUp(args){}
|
| Mouse Down Event | Not Applicable |
Event: gaugeMouseDown<ejs-lineargauge id="gauge" gaugeMouseDown="gaugeMouseDown"></ejs-lineargauge></br>function gaugeMouseDown(args){}
|
| Mouse Leave Event | Not Applicable |
Event: gaugeMouseLeave<ejs-lineargauge id="gauge" gaugeMouseLeave="gaugeMouseLeave"></ejs-lineargauge></br>function gaugeMouseLeave(args){}
|
| Mouse Click Event |
Event: mouseClick<ej-linear-gauge id="gauge" mouse-click="mouseClick"></ej-linear-gauge></br>function mouseClick(args){}
|
Not Applicable |
| Render Complete Event |
Event: renderComplete<ej-linear-gauge id="gauge" render-complete="render"></ej-linear-gauge></br>function render(args){}
|
Not Applicable |
| Double Click Event |
Event: doubleClick<ej-linear-gauge id="gauge" double-click="double"></ej-linear-gauge></br>function double(args){}
|
Not Applicable |
| Right Click Event |
Event: rightClick<ej-linear-gauge id="gauge" right-click="rightClick"></ej-linear-gauge></br>function rightClick(args){}
|
Not Applicable |
| BarPointers Event |
Event: drawBarPointers<ej-linear-gauge id="gauge" draw-bar-pointers="drawPointer"></ej-linear-gauge></br>function drawPointer(args){}
|
Not Applicable |
| Indicators Event |
Event: drawIndicators<ej-linear-gauge id="gauge" draw-indicators="indicators"></ej-linear-gauge></br>function indicators(args){}
|
Not Applicable |
| MarkerPointer Event |
Event: drawMarkerPointers<ej-linear-gauge id="gauge"draw-marker-pointers="markerPointer"></ej-linear-gauge></br>function markerPointer(args){}
|
Not Applicable |
| Ranges Event |
Event: drawRange<ej-linear-gauge id="gauge" draw-range="range"></ej-linear-gauge></br>function range(args){}
|
Not Applicable |
| Gauge Initialized Event |
Event: init<ej-linear-gauge id="gauge" init="init"></ej-linear-gauge></br>function init(args){}
|
Not Applicable |