Interactive & responsive 2D & 3D charts with
unmatched rendering speed.
When just fast isn’t enough.
v.2.1.0
Audio visualization
The audio data is extracted in real-time using Web Audio API's. This chart displays the last 1 million samples of the audio input.
Trading demo
Gets OHLC data from REST API and shows data with technical indicators
Real-time scrolling
Shows real-time line chart with 5 x 1 million points, and shows FPS count
Static data speed test
Measures how long it takes to render 1 million data points of static data
More Examples
LightningChart JS Audio visualization showcase
The audio data is extracted in realtime using Web Audio API's. The Web Audio API has an .createAnalyser() method that can be used to create a new AnalyzerNode. The AnalyzerNode has methods to get time-domain data (waveform) and frequency data which is data from Fast Fourier transform on the audio signal. The time-domain data is shown as is on the Time Domain chart. That same data is also pushed to the Waveform history chart. This chart displays the last 1 million samples of the audio input. The last chart, Spectrum, is used to display three different series.
- Spectrum of the latest samples.
- Maximum frequencies seen.
- Decaying frequency history.
LightningChart JS Trading showcase application
Trading chart with live data fetched from alphavantage.co
Features:
- OHLC
- Simple Moving Average
- Exponential Moving Average
- Bollinger Bands
- Volume
- Relative Strength Index
LightningChart JS Streaming data showcase application
Scrolling of large quantitities of random data in real-time, across multiple channels.
Rendered frames-per-second (FPS) and incoming data points-per-second (PPS) are displayed on Chart.
LightningChart JS Rendering speed showcase application
Measures the time (in milliseconds) required to render a LineSeries with one million data-points.
Result is shown on Chart.
Javascript High-Performance WebGL Charts
LightningChart JS is a WebGL based, cross-platform charting library that has been developed for delivering an outstanding performance of your charts which ensures high refresh rates and smooth animations of your application. It features accessible API documentation, extensive functionality and an innovative dashboard control. LightningChart JS chart library combines incredible speed with sturdy load capacity.
Optimal for demanding industries like engineering, healthcare engineering & medical devices, industrial process control and trading.
Dashboard
Makes it easy and convenient to manage dozens of charts, legend boxes, buttons, check boxes and other UI elements. Resource-efficient rendering of all charts in one GPU scene also makes resizing columns and rows very fast.
Animations
Exceptionally powerful rendering ensures smooth animations exceeding all industry standards in amount of data per chart. Intuitive touch screen interactivity with zooming, panning, moving data cursors and so on.
WebGL rendering
GPU acceleration and WebGL rendering ensure that your device’s graphics processor is utilized efficiently, which results in high refresh rates and an outstanding execution performance.
Server side rendering
LightningChart JS supports Server side rendering. Server side rendering can be used with our headless package available in npm. Use our charts in a server application to produce high-quality chart images.
XY Charts
- Series types: Line and point series, area series, area range series, OHLC series, rectangles, ellipses, box-whisker and line segment series.
- Linear axes can be placed left/right/top/bottom and possibility to have several X and Y axes per chart.
- Scaling modes include fitting, Expansion, Progressive/ Regressive and Manual.
- Markers and data cursors have customizable shape and styles.
3D Charts
- Series types: Line series, Point series, PointLine series, PointCloud series.
- Customize the shape of the Bounding Box of the 3D Chart.
- Linear Axes for X, Y and Z planes around Bounding Box of the 3D Chart.
- Use Numeric and DateTime format with Axis ticks.
- Camera can be controlled to rotate around and zoom in / out of the Chart area.
3D Box Series
- Customizable with: value based coloring, solid coloring for all boxes, individual box colors.
- Customize the roundness of the Box Shape edges.
3D Surface Series
- Customizable with: value based coloring, solid coloring, Data-Point based coloring.
- Comes with customizable wireframe.
Heatmaps
- Usable in XY Charts.
- Create a 2D rectangular heatmap using the IntensityGrid option.
- Create a 2D mesh Heatmap using the IntensityMesh option.
- Use Heatmaps to create Spectograms.
Zoom Band Charts
- Add a customizable, easy-to-use Zoom Band Chart to your XY Charts inside a Dashboard.
- Shows an overview of detailed data of the attached charts.
- Quick zooming with a band.
- Automatically adds all Series inside the Axis it attaches to.
Radar / Spider charts
- Categorical automatically generated axes.
- Round and lines grid.
- Line, point and filled area series.
- Scaling modes include fitting, expansion and manual.
- Data cursors have customizable shape and styles.
Pie / Donut charts
- Slices can be styled using different fill and border-styles.
- Fully customizable sorting and formatting of slices.
- Slice value transitions as well as disposing/restoring are animated.
- Labels can be set on side with connector-lines or inside Slices
- Slices can be “exploded” programmatically or by mouse/touch.
Funnel Charts
- Slices can be styled using different fill and stroke styles.
- Slices can have empty gaps in between.
- Fully customizable sorting and formatting of slices.
- Labels can be set on side with connector lines or inside slices.
- Two different ways to show the slices based on their values: Variable width and Variable height.
- Slices can be animated. Changing values of slices, adding and removing slices support animations.
- User can enable or disable animations for all slices.
Gauge Charts
- Gauge can be styled using different fill and stroke styles.
- Set the thickness of the Gauge.
- Gauge Slice can be styled using different fill styles.
- Fully customizable formatting and styling of slices.
- Customize the start and end angles of the gauge.
- Customize the value interval of the gauge.
- Gauge value change, interval and angle transitions and gauge dispose/restore are animated.
Pyramid Charts
- Slices can be styled using different fill and stroke styles.
- Slices can have empty gaps in between.
- Fully customizable sorting and formatting of slices.
- Labels can be set on side with connector lines or inside slices.
- Slices can be animated. Changing values of slices, adding and removing slices support animations.
- User can enable or disable animations for all slices.
The highest-performance charting library for the web
LightningChart® JS comes with an outstanding execution performance ‑ monitor dozens of data feeds simultaneously using high data rates.
GPU acceleration and WebGL rendering ensure that your device’s graphics processor is utilized efficiently, which results in high refresh rates and smooth animations.
Learn more about LightningChart JS performance levels on performance test results page.
Performance is up to TENS of MILLIONS of data points in real-time
Top user experience
LightningChart® JS’s exceptionally powerful rendering ensures smooth animations exceeding all industry standards in amount of data per chart. The graphing library provides intuitive touch screen interactivity with zooming, panning, moving data cursors and so on.
Dashboard control makes it easy and convenient to manage dozens of charts, legend boxes, buttons, check boxes and other UI elements. The dashboard is rendered resource‑efficiently in single GPU‑scene which also makes resizing columns and rows very fast.
Comprehensive set of examples
The Interactive Examples contain dozens of samples and code modification
on-the-fly.
Resources
We prepared valuable resources for developers to get to know
LightningChart JS better!
Product documentation, FAQ, performance demo, interactive examples and more – visit our resources page with comprehensive support and informational materials for LightningChart JS.
Still not convinced?
Read our article and discover 5 reasons «Why LightningChart JS» should become your charting solution
Free community license
Download free community license of LightningChart® JS for your non-commercial projects, studies and other personal use.
Share your code examples, help fellow developers and get your own questions answered by LightningChart® JS community – use tag ‘lightningchart’ at StackOverflow to access the knowledgebase.
Community license features
+ provides full functionality of LightningChart JS
+ unlimited usage period
+ access to product updates and community support
– not for commercial web sites or usage
– contains product watermark
– no source code availability
– no support tickets available
Interested in LightningChart® JS for commercial use?
Check our pricing and licensing options
LightningChart .NET Product page Resources Free 30-day Trial
LightningChart JS Product page Resources Community License
LightningChart® is a registered trademark of Arction Ltd. All rights reserved. © Arction Ltd 2021
