UNPKG

@syncfusion/ej2-lineargauge

Version:
65 lines (42 loc) 4.72 kB
# ej2-lineargauge The linear gauge control is used to visualize numerical values of an axis in linear manner. All the linear gauge elements are rendered using Scalable Vector Graphics (SVG). ![Linear Gauge](https://ej2.syncfusion.com/products/images/lineargauge/readme.gif) > Linear gauge is part of Syncfusion Essential JS 2 commercial program. License is available in two models Community and Paid. Please refer the license file for more information. License can be obtained by registering at [https://www.syncfusion.com/downloads/essential-js2](https://www.syncfusion.com/downloads/essential-js2?utm_source=npm&utm_campaign=lineargauge) ## Setup To install linear gauge and its dependent packages, use the following command ```sh npm install @syncfusion/ej2-lineargauge ``` ## Resources * [Getting Started](https://ej2.syncfusion.com/documentation/linear-gauge/getting-started.html?lang=typescript) * [View Online Demos](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=lineargauge#/material/lineargauge/default.html) * [Product Page](https://www.syncfusion.com/products/javascript/lineargauge) ## Supported Frameworks Linear gauge component is also offered in following list of frameworks. 1. [Angular](https://www.npmjs.com/package/@syncfusion/ej2-ng-lineargauge?utm_source=npm&utm_campaign=lineargauge) 2. [React](https://www.npmjs.com/package/@syncfusion/ej2-react-lineargauge?utm_source=npm&utm_campaign=lineargauge) 3. [Vue.js](https://www.npmjs.com/package/@syncfusion/ej2-vue-lineargauge?utm_source=npm&utm_campaign=lineargauge) 4. [ASP.NET Core](https://aspdotnetcore.syncfusion.com/LinearGauge/Default#/material) 5. [ASP.NET MVC](https://aspnetmvc.syncfusion.com/LinearGauge/DefaultFunctionalities#/material) 6. [JavaScript (ES5)](https://www.syncfusion.com/products/javascript/lineargauge) ## Use case samples * CPU Utilization ([Live Demo](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=lineargauge#/material/lineargauge/annotation.html)) ## Key Features * [**Orientation**](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=lineargauge#/material/lineargauge/container.html) - Renders in both vertical and horizontal orientations. * [**Container**](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=lineargauge#/material/lineargauge/container.html) - Supports three types of containers: normal, rounded rectangle, and thermometer. * [**Axes**](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=lineargauge#/material/lineargauge/axes.html) - Axes is a collection of linear axis that can be used to indicate the numeric values. * [**Ranges**](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=lineargauge#/material/lineargauge/ranges.html) - Supports ranges to categorize the axis values. Any number of ranges can be added to the linear gauge. * [**Pointers**](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=lineargauge#/material/lineargauge/axes.html) - Pointers are used to indicate values on the axis. Linear gauge supports two types of pointers: bar and marker. * [**Annotation**](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=lineargauge#/material/lineargauge/annotation.html) - Uses any custom HTML element as annotations and place it anywhere on the gauge. * [**Tooltip**](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=lineargauge#/material/lineargauge/tooltip.html) - Provides information about the pointer values on mouse hover. * [**Pointer Drag**](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=circulargauge#/material/circulargauge/user-interaction.html) - Provides support to place the pointer at the desired values by dragging it. ## Support Product support is available for through following mediums. * Creating incident in Syncfusion [Direct-trac](https://www.syncfusion.com/support/directtrac/incidents?utm_source=npm&utm_campaign=lineargauge) support system or [Community forum](https://www.syncfusion.com/forums/essential-js2?utm_source=npm&utm_campaign=lineargauge). * New [GitHub issues](https://github.com/syncfusion/ej2-javascript-ui-controls/issues). * Ask your query in Stack Overflow with tag `syncfusion`, `ej2`. ## License Check the license detail [here](https://github.com/syncfusion/ej2-javascript-ui-controls/blob/master/controls/lineargauge/license?utm_source=npm&utm_campaign=lineargauge). ## Changelog Check the changelog [here](https://github.com/syncfusion/ej2-javascript-ui-controls/blob/master/controls/lineargauge/CHANGELOG.md?utm_source=npm&utm_campaign=lineargauge) © Copyright 2019 Syncfusion, Inc. All Rights Reserved. The Syncfusion Essential Studio license and copyright applies to this distribution.