JavaScript Chart - Examples
SciChart.js ships with over 80 JavaScript Chart demos which you can browse, view the source code and see related documentation. Build incredible complex dashboards with SciChart.js, our High Performance JavaScript Chart Library.
This page demonstrates how to create a JavaScript Line Chart using SciChart.js.
The FastLineRenderableSeries can be used to render an XyDataSeries, XyyDataSeries (uses Y1 only) or an OhlcDataSeries (renders Close). Learn more about this graph type below and view an interactive example.
Custom Color Maps
SciChart.js makes anything possible. Want to create a one-of-a-kind branded graph? You can do that with our PaletteProvider API, which allows you to add unique colors to different points on your graph. You can even create custom themes, giving your charts a distinctive (and coherent) appearance.
Dealing with high amounts of data
SciChart.js supports massive datasets with millions of individual data points – and best of all, it’s optimized to load them all in seconds. Whether you’re looking to create expansive point clouds or make effortless comparisons of large datasets, SciChart can handle it.
Use cases and industries
Perfect for comparing the relationship between two variables or tracking the evolution of data over time, line charts are one of the most widely used types.
With that in mind, the list of potential use cases for them is infinite. At SciChart, our customers vary enormously. Sectors using our software include pharmaceuticals, oil and gas, medical, instrumentation, defence, aerospace, motorsport, process automation, mining, investment banking, trading and more.
Ready to create your JavaScript line charts?
How does it work?
Creating a line chart within SciChart.js is simple. To get started, use the source code below – and when you’re ready to experiment with additional possibilities, check out our line chart documentation.
SciChart allows you to render gaps in lines, add point markers and paint line segments with varying colors, including gradient fill options.
How to get started
Ready to get started and begin playing around with the many features SciChart has to offer? Have a read of our handy Getting Started guide, which tells you how to…
- Get started for free with our community edition.
- Code a chart with NPM and Webpack, with step-by-step samples included.
- Compile our examples app and gain access to 80+ chart examples.
- Build a charting app of your own, with easy-to-follow tutorials.
Why use SciChart?
- Fast rendering for real-time data feeds
- Supports customisable, interactive features
- Five-star rated support for developers
- Winner of the Queen’s Award for Innovation
- Extensive features for complex charts
FAQs
What technical support will I get?
Developers can access a responsive online support forum, allowing you to get your questions answered quickly. We’re always available to contact, and our customers benefit from an efficient ticketing support system.
What alternatives to line graphs are available?
Any type of graph you can think of is possible within SciChart, including scatter charts and 2D and 3D bubble charts.
How much does SciChart cost per developer?
Our community edition grants unlimited free access to our JavaScript charts. To get full commercial access, view our full list of individual and package prices.
