LightningChart JS v.1.0 features

  • Optimized for real-time data visualization and high-speed streaming data
  • Fully GPU accelerated (WebGL)
  • Zooming and panning, with mouse and touch-screen
  • Dashboard to manage layout of several charts and resize them:
    • – Resource-efficient rendering of all charts in one GPU scene
    • – Columns and rows definition
    • – Objects column and row spans definition
    • – Columns and rows can be resized with built-in splitters
    • – Cells for UI Elements and Legends
  • Legend boxes
  • All common transitions have toggleable, fluid animations
  • Develop with  JavaScript or TypeScript
lightningChart JS full features

Chart types

XY cartesian charts

  • Rectangle series: rectangles with border, e.g. for making bar charts and time-span charts
  • Ellipse series: simple ellipses with borders and two radiuses
  • Box-whisker series: box and whiskers for statistical data
  • Line segment series: Efficient way e.g. to render vertical or horizontal line segments.
Linear axes
  • Placement on left/right/top/bottom
  • Several X and Y axes / chart
  • Numeric scale with labels formatters
  • Date-Time scale
  • Optional title of Axis
  • Custom ticks: Gridline + tick marker + label
  • Scaling modes:
    • - Fitting
    • - Expansion
    • - Progressive/ Regressive
    • - Manual
  • Animated scrolling, zooming and fitting
Line and point series
  • Line series, arbitrary
  • Points series (scatter plot) + individual points coloring
  • Point-line series, arbitrary, with points + individual points coloring
  • Spline line plot + individual points coloring
  • Step line series: before / middle / after step alignments + individual points coloring
  • Progressive and regressive line series: vertical and horizontal
  • Automatic data cursor as default, and customizable cursors
Area series
  • Modes:
    - Monopolar: positive /negative directions from specified base level
    - Bipolar: both directions from specified base level
  • Fill and line style
  • Automatic data cursor as default, and customizable cursors
  • Progressive and regressive area series: horizontal
Area range series
  • Each filled position given defined with high and low value
  • Fill and line style for non-reversed and reversed states
  • Automatic data cursor as default, and customizable cursors
  • Progressive and regressive area range series: horizontal
OHLC series
  • Data input as Open-High-Low-Close, or XY-points
  • Visualization as candle-sticks and bars
  • Automatic packing based on resolution
Markers
  • Tracking point
  • Hair-cross lines
  • Labels on axes
  • Label on tracking point
  • Customizable shape and styles
Data cursors
  • Finds nearest series
  • Tracks interpolated data value
  • Tracks nearest data value
  • Tracking point
  • Hair-cross lines
  • Labels on axes
  • Label on tracking point
  • Customizable shape and styles
UI Elements
  • Label
  • Button
  • Checkbox
  • Row (Horizontal stacked panel)
  • Column (Vertical stacked panel)
  • All UI Elements can be dragged with mouse and touch

Spider / radar charts

  • Categorical automatically generated axes
  • Round and lines grid
  • Line, point and filled area series:
    • - Spider chart value transitions as well as disposing/restoring are animated
  • Data cursors
  • Scaling modes:
    • - Fitting
    • - Expansion
    • - Manual

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
  • Two designs:
    • - Labels on side with connector-lines
    • - Labels 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.

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.

Library distribution channels

LightningChart JS is available as: 

  • NPM package, JavaScript, TypeScript typings included 
  • IIFE JavaScript library for including in traditional HTML page, TypeScript typings included in the downloadable archive in the Customer Portal 

Technical requirements

Hardware

WebGL compatible graphics hardware, with lately updated drivers/software.

Software

Compatible web browsers tested by Arction Dec 2018:

Google Chrome, Mozilla Firefox, Microsoft Edge, Safari, Opera, Yandex, Baidu, Maxthon, Sogou, 360 chrome, QQ, Liebao / Cheetah

Internet connection requirements

Development

  • Development with a  Commercial development key, requires internet connection for license key checking
  • Community license currently doesn't currently require internet connection in development.

Deployment

Deployment means "Running the final application".

The application with LC JS binaries can be deployed to:

  • Community license and Commercial license: public web site - internet connection is required
  • Commercial
    • internal solution in internet or cloud: internet connection is required.
    • Internal solution in local area network: local area network connection is required.

Interested in LightningChart® JS for commercial use?
Check our pricing and licensing options