# LightningChart JS developer documentation > The 1 stop developer guide for all things LightningChart JS This file contains links to documentation sections following the llmstxt.org standard. ## Table of Contents - [API](https://lightningchart.com/js-charts/docs/api/): A full LightningChart JS API reference is available under a separate resource. - [Contact](https://lightningchart.com/js-charts/docs/contact/): Take advantage of your special commercial trial privileges for both technical and commercial queries - [Online examples](https://lightningchart.com/js-charts/docs/examples/): Interactive Examples shows more realistic use cases. You can also see and experiment with the application code in there. - [Axis](https://lightningchart.com/js-charts/docs/features/axis/): Here you can find guides for most often required configurations of Axis, a critical part of almost all chart types. - [Bar Chart](https://lightningchart.com/js-charts/docs/features/bar/): `BarChart` feature can be used for a number of different "bar" type visualizations: - [Cursor](https://lightningchart.com/js-charts/docs/features/cursor/): LightningChart JS has a built in Cursor functionality. - [Box](https://lightningchart.com/js-charts/docs/features/d3/box/): 3D feature for rendering a collection of 3D boxes with individual locations and sizes. - [Bubble](https://lightningchart.com/js-charts/docs/features/d3/bubble/): A common visualization type that extends from a [Scatter chart](/features/d3/scatter). The bubble chart is a scatter chart with individual point si... - [3D Chart](https://lightningchart.com/js-charts/docs/features/d3/): `Chart3D` is a collection of series, axes and other chart components. - [Line](https://lightningchart.com/js-charts/docs/features/d3/line/): ```ts - [Mesh model](https://lightningchart.com/js-charts/docs/features/d3/mesh-model/): `Chart3D` includes a feature for rendering 3D models and objects. - [Point Cloud](https://lightningchart.com/js-charts/docs/features/d3/point-cloud/): A variation of [Scatter chart](/features/d3/scatter), the Point Cloud refers to a high density scatter chart where each point is displayed as 1 pix... - [Point-Line](https://lightningchart.com/js-charts/docs/features/d3/point-line/): ```ts - [Scatter](https://lightningchart.com/js-charts/docs/features/d3/scatter/): A commonly needed visualization feature is to display a set of X+Y+Z points scattered around. - [Scrolling surface](https://lightningchart.com/js-charts/docs/features/d3/scrolling-surface/): A variant of Surface, this feature is suitable for streaming applications where data is measured and visualized in real-time. - [Surface](https://lightningchart.com/js-charts/docs/features/d3/surface/): `Chart3D` includes a feature for rendering high resolution 3D surfaces. - [Data Grid](https://lightningchart.com/js-charts/docs/features/data-grid/): - [Donut Chart](https://lightningchart.com/js-charts/docs/features/donut/): Apart from high performance data visualization features, LightningChart JS also includes commonly needed standard features, such as Pie charts: - [Funnel Chart](https://lightningchart.com/js-charts/docs/features/funnel/): Apart from high performance data visualization features, LightningChart JS also includes commonly needed standard features, such as Funnel charts: - [Gauge Chart (Linear)](https://lightningchart.com/js-charts/docs/features/gauge-linear/): `Gauge` is used to display a single data value (number) on a straight horizontal or vertical scale. - [Gauge Chart (Radial)](https://lightningchart.com/js-charts/docs/features/gauge/): `Gauge` is used to display a single data value (number) in the form of a dial. - [Interop with UI frameworks](https://lightningchart.com/js-charts/docs/features/html-interop/): LightningChart JS is a frontend library for data visualization. - [Features](https://lightningchart.com/js-charts/docs/features/): LightningChart JS has a lot of features, and there are continuously more added in. - [Legend](https://lightningchart.com/js-charts/docs/features/legend/): All charts will create a default legend on initialization, which can be accessed through the `legend` property of the chart: - [Map Chart](https://lightningchart.com/js-charts/docs/features/map/): The `MapChart` can be used to display regions of the world in an interactive chart. - [Parallel Coordinate Chart](https://lightningchart.com/js-charts/docs/features/parallel-coordinate-chart/): The Parallel Coordinate Chart can be used to display a list of data points across an arbitrary number of measurement _Axes_. - [Pie Chart](https://lightningchart.com/js-charts/docs/features/pie/): Apart from high performance data visualization features, LightningChart JS also includes commonly needed standard features, such as Pie charts: - [Area](https://lightningchart.com/js-charts/docs/features/polar/area/): ![Polar area chart](/img/polar-area-light.png#light-mode-only)![Polar area chart](/img/polar-area-dark.png#dark-mode-only) - [Heatmap](https://lightningchart.com/js-charts/docs/features/polar/heatmap/): `PolarChart` includes a feature for rendering high resolution Polar heat-maps. - [Polar Chart](https://lightningchart.com/js-charts/docs/features/polar/): `PolarChart` is a collection of polar series, axes and other chart components. - [Line](https://lightningchart.com/js-charts/docs/features/polar/line/): ![Polar line chart](/img/polar-light.png#light-mode-only)![Polar line chart](/img/polar-dark.png#dark-mode-only) - [Pictures](https://lightningchart.com/js-charts/docs/features/polar/pictures/): A common need in different Polar Chart based visualizations is to show custom pictures positioned on axis coordinates. - [Point-Line](https://lightningchart.com/js-charts/docs/features/polar/point-line/): ![Polar point line chart](/img/polar-point-line-light.png#light-mode-only)![Polar point line chart](/img/polar-point-line-dark.png#dark-mode-only) - [Scatter](https://lightningchart.com/js-charts/docs/features/polar/scatter/): ![Polar point chart](/img/polar-point-light.png#light-mode-only)![Polar point chart](/img/polar-point-dark.png#dark-mode-only) - [Sector](https://lightningchart.com/js-charts/docs/features/polar/sector/): Polar sectors are complementary components within `PolarChart` which highlight a range along both Amplitude axis and Radial axis: - [Pyramid Chart](https://lightningchart.com/js-charts/docs/features/pyramid/): Apart from high performance data visualization features, LightningChart JS also includes commonly needed standard features, such as Pyramid charts: - [Radar Chart](https://lightningchart.com/js-charts/docs/features/radar/): ```ts - [Reporting](https://lightningchart.com/js-charts/docs/features/reporting/) - [Spider Chart](https://lightningchart.com/js-charts/docs/features/spider/): Spider Chart is generally used to compare multivariate quantitative data set. - [Sun Burst Chart](https://lightningchart.com/js-charts/docs/features/sunburst/): Apart from high performance data visualization features, LightningChart JS also includes commonly needed standard features, such as Sun burst charts: - [Tree Map Chart](https://lightningchart.com/js-charts/docs/features/treemap/): Apart from high performance data visualization features, LightningChart JS also includes commonly needed standard features, such as TreeMap charts: - [UI components](https://lightningchart.com/js-charts/docs/features/ui/): LightningChart JS includes built-in features for simple UI components, like _Text Boxes_ and _Legends_. - [User interactions](https://lightningchart.com/js-charts/docs/features/user-interactions/): LightningChart JS components come with a set of built-in user interactions. - [Area Range](https://lightningchart.com/js-charts/docs/features/xy/area-range/): Area range series can fill sections between ranges of Y values. - [Area](https://lightningchart.com/js-charts/docs/features/xy/area/): ```ts - [Band](https://lightningchart.com/js-charts/docs/features/xy/band/): Axis Bands are components under `ChartXY` `Axis`, which users can create and control freely. - [Bubble](https://lightningchart.com/js-charts/docs/features/xy/bubble/): A common visualization type that extends from a [Scatter chart](/features/xy/scatter). The bubble chart is a scatter chart with individual point si... - [Constant Line](https://lightningchart.com/js-charts/docs/features/xy/constant-line/): Axis Constant Lines are components under `ChartXY` `Axis`, which users can create and control freely. - [Figures and text](https://lightningchart.com/js-charts/docs/features/xy/figures/): This section covers a number of different series - so called "Figure Series". - [Freeform Line](https://lightningchart.com/js-charts/docs/features/xy/freeform-line/): Instead of displaying progressive data, you can also display scatter or otherwise freeform data sets with line series. - [Heatmap](https://lightningchart.com/js-charts/docs/features/xy/heatmap/): LightningChart JS has a powerful feature for displaying high resolution heatmaps. - [Histogram](https://lightningchart.com/js-charts/docs/features/xy/histogram/): The best approach to displaying Histograms with LightningChart JS is by using `ChartXY` and `RectangleSeries`. - [XY Chart](https://lightningchart.com/js-charts/docs/features/xy/): `ChartXY` is a collection of series, axes and other chart components. - [Line](https://lightningchart.com/js-charts/docs/features/xy/line/): The best and most appreciated feature of LightningChart JS is the simple `LineSeries`. - [Pictures](https://lightningchart.com/js-charts/docs/features/xy/pictures/): A common need in different XY Chart based visualizations is to show custom pictures positioned on axis coordinates. - [Point-Line](https://lightningchart.com/js-charts/docs/features/xy/point-line/): Combination of displaying points and connected line strokes. - [Scatter](https://lightningchart.com/js-charts/docs/features/xy/scatter/): A commonly needed visualization feature is to display a set of X+Y points scattered around. - [Scrolling heatmap](https://lightningchart.com/js-charts/docs/features/xy/scrolling-heatmap/): A variant of Heatmap, this feature is suitable for streaming applications where data is measured and visualized in real-time. - [Spline](https://lightningchart.com/js-charts/docs/features/xy/spline/): The Spline series is a point-line series with an automatic polynomial interpolation that produces smooth curves. - [Step](https://lightningchart.com/js-charts/docs/features/xy/step/): The Step series is a point-line series with an automatic stepping interpolation resulting in only sharp turns of curve. - [Sweeping updates](https://lightningchart.com/js-charts/docs/features/xy/sweeping/): ![Chart with sweeping line series](/img/sweeping-line-chart-light.png#light-mode-only)![Chart with sweeping line series](/img/sweeping-line-chart-d... - [Zoom Band Chart](https://lightningchart.com/js-charts/docs/features/zoom-band/): The Zoom band chart is generally a complementary chart type used in conjunction with 1 or more [XY charts](/features/xy). - [Android](https://lightningchart.com/js-charts/docs/frameworks/android/): :::info - [Angular](https://lightningchart.com/js-charts/docs/frameworks/angular/): Angular is one of the most popular web frontend frameworks at the moment. - [ASP .NET](https://lightningchart.com/js-charts/docs/frameworks/asp-dot-net/): ASP.NET Core: Microsoft's lightweight, cross-platform framework for building high-performance web applications and APIs. It's modular, open-source,... - [Blazor](https://lightningchart.com/js-charts/docs/frameworks/blazor/): [Blazor](https://dotnet.microsoft.com/en-us/apps/aspnet/web-apps/blazor/) is a web framework that enables developers to create web apps using C# and... - [Capacitor (Ionic)](https://lightningchart.com/js-charts/docs/frameworks/capacitor/): Please find the original LightningChart JS template for Capacitor [here](https://lightningchart.com/js-charts/frameworks/ionic-capacitor/) and [get... - [Electron](https://lightningchart.com/js-charts/docs/frameworks/electron/): Electron is a popular development framework for Desktop applications. - [Flutter](https://lightningchart.com/js-charts/docs/frameworks/flutter/): Flutter is a cross-platform framework developed by Google that lets developers build apps for iOS, Android, web, and desktop from a single Dart cod... - [Frameworks](https://lightningchart.com/js-charts/docs/frameworks/): LightningChart JS can be used with practically any **JavaScript frontend framework**, such as React, Vue, Angular, etc. - [iOS](https://lightningchart.com/js-charts/docs/frameworks/ios/): Please find the original LightningChart JS template for iOS [here](https://lightningchart.com/js-charts/frameworks/ios/) and [get in touch](/contac... - [MAUI](https://lightningchart.com/js-charts/docs/frameworks/maui/): :::info - [Next.js](https://lightningchart.com/js-charts/docs/frameworks/next-js/): The basic usage of LightningChart JS in Next.js is very similar compared to [React](../react): - [Python](https://lightningchart.com/js-charts/docs/frameworks/python/): LightningChart is also available in Python, please see [LightningChart Python](https://lightningchart.com/python-charts/) for more information. - [Qlik](https://lightningchart.com/js-charts/docs/frameworks/qlik/): Please find the original LightningChart JS template for Qlik [here](https://lightningchart.com/js-charts/plugins/qlik/) and [get in touch](/contact... - [Quasar](https://lightningchart.com/js-charts/docs/frameworks/quasar/): Please find the original LightningChart JS template for Quasar [here](https://github.com/Lightning-Chart/lcjs-quasar-template/) and [get in touch](/... - [R](https://lightningchart.com/js-charts/docs/frameworks/r/): Please find the original LightningChart JS template for R [here](https://lightningchart.com/js-charts/frameworks/r/) and [get in touch](/contact) f... - [React Native](https://lightningchart.com/js-charts/docs/frameworks/react-native/): React Native is a cross-platform framework developed by Meta that lets developers build native iOS and Android apps using JavaScript and React. It ... - [React](https://lightningchart.com/js-charts/docs/frameworks/react/): React is one of the most popular web frontend frameworks at the moment. - [SvelteKit](https://lightningchart.com/js-charts/docs/frameworks/sveltekit/): [SvelteKit](https://svelte.dev/) is a wonderful web framework that has been gathering wide appreciation and interest among web developers recently.... - [Uno](https://lightningchart.com/js-charts/docs/frameworks/uno/): Please find the original LightningChart JS template for Uno [here](https://lightningchart.com/js-charts/frameworks/uno-platform/) and [get in touch... - [Vanilla JS](https://lightningchart.com/js-charts/docs/frameworks/vanilla/): "Vanilla JS" refers to frontend applications that are directly created with JavaScript, HTML and CSS, without relying on any framework. While using... - [Vue](https://lightningchart.com/js-charts/docs/frameworks/vue/): Vue is one of the most popular web frontend frameworks at the moment. - [Wordpress](https://lightningchart.com/js-charts/docs/frameworks/wordpress/): Please find the original LightningChart JS template for Wordpress [here](https://lightningchart.com/js-charts/plugins/wordpress/) and [get in touch... - [Xamarin](https://lightningchart.com/js-charts/docs/frameworks/xamarin/): Please find the original LightningChart JS template for Xamarin [here](https://lightningchart.com/js-charts/frameworks/xamarin/) and [get in touch]... - [Getting started](https://lightningchart.com/js-charts/docs/getting-started/): - [Installation](https://lightningchart.com/js-charts/docs/installation/): LightningChart JS can be installed from NPM (Node Package Manager) with the following command, as long as you have Node.js installed. - [LightningChart and AI](https://lightningchart.com/js-charts/docs/lc-and-ai/): import useBaseUrl from '@docusaurus/useBaseUrl'; - [DuckDB Wasm](https://lightningchart.com/js-charts/docs/libraries-databases/duckdb/): [DuckDB Wasm](https://duckdb.org/docs/api/wasm/overview.html) is a frontend library that can be used to make data queries to remote databases or fi... - [Related technologies](https://lightningchart.com/js-charts/docs/libraries-databases/): This category is a living collection of technologies that our customers are using with their LightningChart JS applications - [App deployment](https://lightningchart.com/js-charts/docs/licenses/app-deployment/): App deployment licenses are used for deployment scenarios where your LightningChart JS application is not tied to any specific domain. - [Developer licenses](https://lightningchart.com/js-charts/docs/licenses/developer-licenses/): When developing a part of an application where LightningChart is visible, a **Developer** License is needed. - [Licensing](https://lightningchart.com/js-charts/docs/licenses/): LightningChart JS is a license-protected library, meaning that in order to use it, you need a _license key_ - [Sandbox sites](https://lightningchart.com/js-charts/docs/licenses/sandbox-sites/): LightningChart JS works without a license when deployed to specific popular sandbox sites. - [Team management](https://lightningchart.com/js-charts/docs/licenses/team-management/): When you purchase LightningChart JS licenses, a Portal account created by the user will be assigned as "Team manager". - [Trials](https://lightningchart.com/js-charts/docs/licenses/trials/): You can start using LightningChart JS completely free of charge in the form of a 30-day Trial. - [Web deployment](https://lightningchart.com/js-charts/docs/licenses/web-deployment/): Web deployment licenses are used for deployment scenarios where your LightningChart JS application is deployed to a specific domain. - [Custom fonts](https://lightningchart.com/js-charts/docs/more-guides/custom-fonts/): LightningChart JS can display any fonts that are loaded to the web page. - [Scrolling to different direction](https://lightningchart.com/js-charts/docs/more-guides/different-scroll-directions/): This section continues from [Scrolling Axis](/features/axis). - [Destroying components](https://lightningchart.com/js-charts/docs/more-guides/dispose/): All LightningChart JS components can be permanently destroyed or cleaned with `dispose` method. - [Altering component draw order](https://lightningchart.com/js-charts/docs/more-guides/draw-order/): By default, the drawing order of series is the same as the order you create them in. - [Grouping charts](https://lightningchart.com/js-charts/docs/more-guides/grouping-charts/): LightningChart JS excels at applications that require several charts to be visible on the same web page. - [HTML text rendering](https://lightningchart.com/js-charts/docs/more-guides/html-text-rendering/): Text rendering is heavy work. - [Setting up LightningChart resources](https://lightningchart.com/js-charts/docs/more-guides/lc-resources/): LightningChart JS is distributed along with some resource files, which are required for select features only: - [Legacy XY features](https://lightningchart.com/js-charts/docs/more-guides/legacy-xy-features/): Legacy XY series `LineSeries`, `PointSeries`, `PointLineSeries`, `AreaSeries`, `StepSeries` and `SplineSeries` have been replaced with `PointLineAr... - [Mobile applications](https://lightningchart.com/js-charts/docs/more-guides/mobile/): LightningChart JS is a JavaScript library so it doesn't directly integrate to any Mobile application development framework. There are, however, a n... - [Nanosecond timestamps](https://lightningchart.com/js-charts/docs/more-guides/nanosecond-timestamps/): LightningChart JS supports displaying data with nanosecond timestamps - learn how! - [Offscreen canvas](https://lightningchart.com/js-charts/docs/more-guides/offscreen-canvas/): LightningChart JS has a beta feature that allows isolating all chart operations to a separate web worker thread and displaying the output to the us... - [Optimizing performance](https://lightningchart.com/js-charts/docs/more-guides/optimizing-performance/): Here you can find some common pointers towards ensuring best application performance when using LightningChart JS. - [Positioning charts](https://lightningchart.com/js-charts/docs/more-guides/positioning-charts/): LightningChart components are positioned using HTML `
` elements and `CSS`. - [Real-time data](https://lightningchart.com/js-charts/docs/more-guides/real-time-data/): LightningChart JS is a real-time oriented data visualization library. - [InfluxDB](https://lightningchart.com/js-charts/docs/more-guides/real-time-data/influxdb/): [InfluxDB](https://www.influxdata.com/) is a common Time Series Database. - [RxJS](https://lightningchart.com/js-charts/docs/more-guides/real-time-data/rxjs/): [RxJS](https://rxjs.dev/) is an useful library for connecting real-time data to data visualizations (as well as other business logic). - [SignalR](https://lightningchart.com/js-charts/docs/more-guides/real-time-data/signal-r/): SignalR is a very popular real-time communication library from Microsoft, especially within .NET framework. - [WebSocket](https://lightningchart.com/js-charts/docs/more-guides/real-time-data/websocket/): The [WebSocket API](https://developer.mozilla.org/en-US/Web/API/WebSockets_API/) is a technology for two-way communication between a browser and a s... - [Styles, colors and fonts](https://lightningchart.com/js-charts/docs/more-guides/styles-colors-and-fonts/): This guide is about Style API, which allows overriding the default style of any single part of a chart during run-time. - [Themes](https://lightningchart.com/js-charts/docs/more-guides/themes/): This section explores a complete way to configure the visual look of LightningChart JS - _Themes_. - [Customer Portal](https://lightningchart.com/js-charts/docs/services/customer-portal/): LightningChart Customer Portal can be found at https://portal.lightningchart.com/user/login - [Customization](https://lightningchart.com/js-charts/docs/services/customization/): Customizing LightningChart JS features to better fit a particular users requirements is very common. Usually, this is done by LightningChart develo... - [Roadmap](https://lightningchart.com/js-charts/docs/services/roadmap/): LightningChart JS is in active development since 2019. - [Support](https://lightningchart.com/js-charts/docs/services/support/): Technical support is available to commercial users of LightningChart JS to help developers use LightningChart JS and resolve problem situations on ... - [Trials and Integration](https://lightningchart.com/js-charts/docs/services/trials-and-integration/): Are you trialing LightningChart JS for commercial purposes? - [Technical information](https://lightningchart.com/js-charts/docs/technical-info/) - [Axis range is limited](https://lightningchart.com/js-charts/docs/troubleshooting/axis-range-is-limited/): If you are running into issues where an Axis (X or Y) doesn't zoom into the data, or won't let you manually zoom into desired range for some reason... - [Chart is not scrolling](https://lightningchart.com/js-charts/docs/troubleshooting/chart-does-not-scroll/): If you run into the issue where you have a scrollable layout containing a chart, and the chart is not moving when scrolled, this happens because th... - [Chart is not interactable](https://lightningchart.com/js-charts/docs/troubleshooting/chart-is-not-interactable/): If you run into the issue where you have a scrollable layout containing a chart, and the chart becomes temporarily un-interactable after scrolling ... - [How can I disable glow/shadow effect?](https://lightningchart.com/js-charts/docs/troubleshooting/disable-glow-shadow/): Effects can be disabled from 1 component (series, title, axis, legend, etc.) by using `setEffect(enabled: boolean)` methods. The exact method might... - [Error: license key is too old](https://lightningchart.com/js-charts/docs/troubleshooting/error-license-key-is-too-old/): The "License key validation failed: License key is too old for this version" error can happen when you are using a license that was purchased with ... - [Error: LightningChart JS Resources not found](https://lightningchart.com/js-charts/docs/troubleshooting/error-resources-not-found/): Please see [Setting up LightningChart resources](/more-guides/lc-resources/) - [Error: Session exists already](https://lightningchart.com/js-charts/docs/troubleshooting/error-session-exists/): The "License key validation failed: Session exists already" error can happen when you are using a developer license key from two different sessions... - [Flickering heatmap](https://lightningchart.com/js-charts/docs/troubleshooting/flickering-heatmap/): LightningChart JS 2D heatmaps can only display 1 heatmap value per 1 visible pixel on display. - [Troubleshooting](https://lightningchart.com/js-charts/docs/troubleshooting/): Do you have an issue? - [How often are there new releases?](https://lightningchart.com/js-charts/docs/troubleshooting/new-releases/): Please see [Roadmap section](/services/roadmap). - [Restricted features](https://lightningchart.com/js-charts/docs/troubleshooting/restricted-features/) - [Text quality looks bad](https://lightningchart.com/js-charts/docs/troubleshooting/text-looks-bad/): There have been some cases where LightningChart JS text sharpness looks bad (worse than other text on the web page). - [Type errors](https://lightningchart.com/js-charts/docs/troubleshooting/type-errors/): If you run into type errors that seem to originate from within the LightningChart JS library, it is possible that there is a conflict between your ... - [Warning: using publicly hosted resources](https://lightningchart.com/js-charts/docs/troubleshooting/warning-using-publicly-hosted-resources/): Please see [Setting up LightningChart resources](/more-guides/lc-resources/)