10 Compelling Reasons to Choose SciChart.js
Tags: javascript, webdev
Published: 2024-03-13 15:00:18

<blockquote>We created our <a title="JavaScript Chart Library" href="https://www.scichart.com/javascript-chart-features">JavaScript Chart Library</a> to <strong>make impossible projects possible</strong>. The reasons users choose SciChart are <strong>Flexibility, customisability, </strong>creating <strong>complex interactions </strong>and<strong> excellent docs &amp; tech support.</strong>

In this blog post we're going to go through <strong>ten compelling reasons </strong>why SciChart.js is the <a href="https://www.scichart.com/javascript-chart-library"><strong>Best JavaScript Chart library in 2024</strong></a> for complex, big-data visualisation applications, and why it's consistently rated number 1 for <a href="https://www.scichart.com/why-scichart-medical-charts-dashboarding-for-research-and-healthcare/" rel="noopener">medical</a>, <a href="https://www.scichart.com/why-scichart-aerospace-defence/" rel="noopener">aerospace</a>, <a href="https://www.scichart.com/why-scichart-best-for-motosport-and-automotive/" rel="noopener">motorsport</a> and <a href="https://www.scichart.com/why-scichart-best-for-financial-stock-trading-applications/" rel="noopener">financial</a> use.

Now with a <strong><a href="https://www.scichart.com/getting-started/scichart-javascript/" rel="noopener">FREE Community Edition</a></strong> why not try out this exciting new library?
<h4>Ten Reasons at a glance:</h4>
<ul>
 	<li><a href="#reason-1">#1 The Fastest, Highest Precision WebGL Charts</a>
<ul style="margin-bottom: 3px !important;">
 	<li><a href="#reason-1-1">#1.1 WebGL Context Limits in competitors</a></li>
 	<li><a href="#reason-1-1">#1.2 Performance Comparison between charts</a></li>
</ul>
</li>
 	<li><a href="#reason-2">#2 Rich Interactions</a></li>
 	<li><a href="#reason-3">#3 Complex Axis Options and Layouts</a></li>
 	<li><a href="#reason-4">#4 Link Multiple Charts together</a></li>
 	<li><a href="#reason-5">#5 Add Many Annotations, Labels to charts</a></li>
 	<li><a href="#reason-6">#6 Create Scientific 3D Charts</a></li>
 	<li><a href="#reason-7">#7 Customize Zooming, Panning</a></li>
 	<li><a href="#reason-8">#8 Modify data by Point &amp; Click</a></li>
 	<li><a href="#reason-9">#9 Style &amp; Animate everything</a></li>
 	<li><a href="#reason-10">#10 Fully Documented, Rich Demos &amp; Tech Support</a></li>
 	<li><a href="#reason-11">What else sets SciChart apart?</a></li>
</ul>
</blockquote>
<h2 id="reason-1">#1 The Fastest, Highest Precision WebGL Charts, Period.</h2>
<span class="TextRun BCX9 SCXO165846831" lang="EN-GB" xml:lang="EN-GB" data-contrast="auto"><span class="NormalTextRun BCX9 SCXO165846831">Other chart libraries struggle with datasets beyond a few thousand points. Many use standard technologies like Canvas or SVG where <a href="https://www.scichart.com/example/javascript-chart/javascript-chart-realtime-performance-demo/">real-time or dynamic charts</a> are difficult or impossible. Some use WebGL but suffer with limits of WebGL context (max 2-16 contexts per page) or have precision issues limiting the amount of zoom into scientific data.</span></span>

Here are some things you can do with SciChart that you cannot do with other chart libraries:
<ul>
 	<li>You can plot <span class="TextRun BCX9 SCXO165846831" lang="EN-GB" xml:lang="EN-GB" data-contrast="auto"><span class="NormalTextRun BCX9 SCXO165846831"><a href="https://demo.scichart.com/javascript-chart-performance-load-one-million-points">millions of data-points</a></span></span> without slowdown.</li>
 	<li>You can plot <span class="TextRun BCX9 SCXO165846831" lang="EN-GB" xml:lang="EN-GB" data-contrast="auto"><span class="NormalTextRun BCX9 SCXO165846831"><a href="https://demo.scichart.com/load-500-series-x-500-points-performance-demo">hundreds of series</a> on a single chart without slowdown.</span></span></li>
 	<li>You can create <span class="TextRun BCX9 SCXO165846831" lang="EN-GB" xml:lang="EN-GB" data-contrast="auto"><span class="NormalTextRun BCX9 SCXO165846831"><a href="https://demo.scichart.com/javascript-multiple-chart-dashboard-performance-demo">dashboards with hundreds of WebGL charts</a> on a single page without hitting browser limits.</span></span></li>
 	<li>You can update chart data in real-time in scientific or analytics applications. The chart will never be a bottleneck.</li>
</ul>
<video style="aspect-ratio: 1.333;" autoplay="autoplay" loop="loop" muted="" controls="controls" width="100%" height="auto">
<span data-mce-type="bookmark" style="display: inline-block; width: 0px; overflow: hidden; line-height: 0;" class="mce_SELRES_start">﻿</span><source src="https://www.scichart.com/wp-content/uploads/2023/08/10-reasons-why-scichart-best-javascript-chart-realtime-updates.mp4" type="video/mp4" /><span data-mce-type="bookmark" style="display: inline-block; width: 0px; overflow: hidden; line-height: 0;" class="mce_SELRES_end">﻿</span>
Your browser does not support the video tag.
</video>
<p style="text-align: center;"><em><strong>Above</strong>: A selection of real-time, big data, <a href="https://demo.scichart.com/javascript-chart-realtime-performance-demo" rel="noopener">high performance charts</a> made with SciChart.js</em></p>

<h5 id="reason-1-1">#1.1 WebGL Context Limits in competitor charts</h5>
<span class="TextRun BCX9 SCXO165846831" lang="EN-GB" xml:lang="EN-GB" data-contrast="auto"><span class="NormalTextRun BCX9 SCXO165846831">SciChart uses a proprietary WebAssembly &amp; WebGL engine but is not limited by the maximum WebGL context issue - a hard limit in the browser which is device dependent. </span></span>

Let's show this with a quick test in Google Chrome browser (16 WebGL context limit):
<ul>
 	<li><a href="https://codepen.io/scichart/pen/rNQbEmZ/d0c6049104cb07b62fe8c877a23af0c0">Try this codepen</a> which uses SciChart and loads 30 charts on screen at once.</li>
 	<li>Now <a href="https://codepen.io/scichart/pen/MWzRMoX/2c2c2624334bad9f36e0646a486c8202">try the same thing with Plotly JS</a>.</li>
 	<li>Finally <a href="https://codepen.io/scichart/pen/yLQrdxx/12a2546dbbca31db13f739c45a25060e">try the same thing with LightningChart.js (LCJS)</a>.</li>
</ul>
What you'll notice is as follows.
<ul>
 	<li>SciChart can load all 30 WebGL charts instantly</li>
 	<li>Plotly starts blanking out at 8 charts as it <a href="https://community.plotly.com/t/too-many-active-webgl-contexts/16379/2">uses 2x WebGL contexts per chart</a>.</li>
 	<li>LCJS loses WebGL contexts after 16 charts.</li>
</ul>
Once the WebGL context limit is hit, old charts are erased. They can be recovered but only if contexts become available.
<blockquote>The WebGL context limit is <a href="https://stackoverflow.com/a/61278833/303612">browser &amp; device dependent</a>. On Google Chrome / Windows it is currently 16, but on a mobile device it may be as low as 2. That means more than 2 charts or 2 usages of WebGL across all tabs and <strong>your application won't work.</strong> This makes WebGL charting useless on mobile for libraries that hit this limit.</blockquote>
<h5 id="reason-1-2">#1.2 Performance Comparisons with other Charts</h5>
<a href="https://www.scichart.com/blog/scichart-is-the-fastest-js-chart-library-available-and-why-that-matters-in-todays-world/" rel="noopener">We tested SciChart.js vs. a variety of competitors</a> and found it outperformed them all by 1-2 orders of magnitude. With performance as a number-one requirement when developing new features, we're always maintaining or improving this aspect of the library.

Here's some graphs from the blog post <a href="https://www.scichart.com/blog/scichart-is-the-fastest-js-chart-library-available-and-why-that-matters-in-todays-world/">comparing JavaScript Charts</a> showing just how dramatic this performance difference is.



Even against LighningChart.js, a competing WebGL chart library, SciChart.js was able to load a <a href="https://www.youtube.com/watch?v=OTOznHgRLTQ">huge dataset of 100,000,000 points considerably faster</a>.
<blockquote>Really nothing else compares to the performance of SciChart.js. With WebGL and WebAssembly, the tech stack is unique, and plus with the expertise of the SciChart team, we're always improving.</blockquote>
<h2 id="reason-2">#2 Create Rich Interactions on Charts</h2>
Other JavaScript charts will show you a drill down demo, where clicking on a chart element fires an event to load a new chart.

With SciChart we take this to a new level. It goes further than most by providing APIs for:
<ul>
 	<li>Get callbacks on <a href="https://www.scichart.com/documentation/js/current/webframe.html#SeriesSelection.html">series hover</a></li>
 	<li>Or, on series <a href="https://www.scichart.com/documentation/js/current/webframe.html#SeriesSelection.html">selection</a></li>
 	<li>Or, <a href="https://www.scichart.com/documentation/js/current/webframe.html#DataPointSelection.html">data-point selection</a></li>
 	<li>Programmatic <a href="https://www.scichart.com/documentation/js/current/webframe.html#Hit-Test%20API.html">hit-testing </a></li>
 	<li>Updating chart data in any of the events above like in <a href="https://demo.scichart.com/javascript-interactive-waterfall-chart">this demo</a>.</li>
</ul>
This means you can create any kind of interaction on the chart. Not only that but <a href="https://www.scichart.com/documentation/js/current/webframe.html#CursorModifier.html">cursors, crosshairs</a>, <a href="https://www.scichart.com/documentation/js/current/webframe.html#RolloverModifier.html">tooltips</a> and customisable <a href="https://www.scichart.com/documentation/js/current/webframe.html#LegendModifier.html">legends</a> are available out of the box.

What if you needed to add behaviour to <span class="TextRun BCX9 SCXO165846831" lang="EN-GB" xml:lang="EN-GB" data-contrast="auto"><span class="NormalTextRun BCX9 SCXO165846831">click, select, hover and dynamically update data like in this <a href="https://demo.scichart.com/javascript-interactive-waterfall-chart" rel="noopener"><strong>waterfall chart demo</strong></a>? Or interact with annotations to change simulation parameters like on this <strong><a href="https://demo.scichart.com/javascript-heatmap-interactions" rel="noopener">Heatmap Interactions demo</a></strong>.</span></span>

<span class="TextRun BCX9 SCXO165846831" lang="EN-GB" xml:lang="EN-GB" data-contrast="auto"><span class="NormalTextRun BCX9 SCXO165846831">For scientific, engineering or business applications which require interactions this shouldn't be a chore. With SciChart.js complex requirements become simple.</span></span>

<video style="aspect-ratio: 1.333;" autoplay="autoplay" loop="loop" muted="" controls="controls" width="100%" height="auto">
<source src="https://www.scichart.com/wp-content/uploads/2023/08/10-reasons-why-scichart-best-javascript-chart-interactions.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
<p style="text-align: center;"><em><strong>Above</strong>: SciChart.js Interactive <a href="https://demo.scichart.com/javascript-interactive-waterfall-chart" rel="noopener">Waterfall Chart demo</a> and <a href="https://demo.scichart.com/javascript-heatmap-interactions" rel="noopener">Rich Interactions Showcase</a> demo</em></p>

<h2 id="reason-3">#3 Complex Axis Options and Layouts</h2>
Other JavaScript chart libraries let you have a single or dual X and Y axis. Some JS charts limit the axis types to category only, meaning x-value spacing is ignored.

With SciChart we take axis types, axis customisation and layout to a whole new level. Here are some things you can do with SciChart that set it apart from other chart libraries:
<ul>
 	<li>You can have unlimited, multiple axis on the <a href="https://demo.scichart.com/javascript-chart-with-multiple-x-axis">left/right/top/bottom</a> of the chart.</li>
 	<li>You can <a href="https://demo.scichart.com/javascript-vertical-charts">rotate charts</a> vertically and have series and tooltips work from top to bottom.</li>
 	<li>You can <a href="https://demo.scichart.com/javascript-vertically-stacked-axes">stack and align axis</a> to create EEG style charts.</li>
 	<li>You can have axis <a href="https://www.scichart.com/documentation/js/current/webframe.html#Axis%20Layout%20-%20Inside%20and%20Central%20Axis.html">inside</a>, outside the chart, or in the <a href="https://www.scichart.com/documentation/js/current/webframe.html#CentralAxisLayout.html">centre</a>.</li>
 	<li>You can mix axis types on the chart: <a href="https://www.scichart.com/documentation/js/current/webframe.html#NumericAxis.html">Linear</a> Axis, <a href="https://www.scichart.com/documentation/js/current/webframe.html#CategoryAxis.html">Category</a> Axis, <a href="https://www.scichart.com/documentation/js/current/webframe.html#DateTimeNumericAxis.html">Date</a> Axis, and <a href="https://www.scichart.com/documentation/js/current/webframe.html#Logarithmic%20Axis.html">Logarithmic</a> Axis are all supported.</li>
 	<li>You can specify <a href="https://www.scichart.com/documentation/js/current/webframe.html#CustomLabelProvider_Numeric.html">formatting of the labels</a> precisely or <a href="https://www.scichart.com/documentation/js/current/webframe.html#CustomLabelProvider_DynamicDates.html">dynamically vary label formatting</a> based on zoom.</li>
 	<li>You can vary the <a href="https://www.scichart.com/documentation/js/current/webframe.html#Axis%20Ticks%20-%20Gridline%20and%20Label%20Spacing%20(Interval).html">spacing of axis gridlines</a>, labels, even vary them <a href="https://www.scichart.com/documentation/js/current/webframe.html#AxisTicks-GridLineAndLabelSpacingProgrammatically.html">programmatically and unequally</a></li>
 	<li>The <a href="https://www.scichart.com/documentation/js/current/webframe.html#LayoutManagers.html">layout API can be extended</a> for unusual axis alignments or layouts.</li>
 	<li>You can <a href="https://www.scichart.com/documentation/js/current/webframe.html#Axis%20Styling%20-%20Title,%20Labels,%20Gridlines%20and%20Axis%20Bands.html">style everything</a> in the axis, and change axis part <a href="https://www.scichart.com/documentation/js/current/webframe.html#AxisVisibility.html">visibility</a>.</li>
 	<li>You can listen to <a href="https://www.scichart.com/documentation/js/current/webframe.html#Axis%20Ranging%20-%20How%20to%20Listen%20to%20VisibleRange%20Changes.html">axis range changes</a> and programmatically <a href="https://www.scichart.com/documentation/js/current/webframe.html#Axis%20Ranging%20-%20Setting%20and%20Getting%20VisibleRange.html">zoom</a> or <a href="https://www.scichart.com/documentation/js/current/webframe.html#Axis%20Ranging%20-%20AutoRange.html">autofit</a> an axis.</li>
</ul>
All of this while maintaining extremely high performance which we mentioned above.

<video style="aspect-ratio: 1.333;" autoplay="autoplay" loop="loop" muted="" controls="controls" width="100%" height="auto">
<source src="https://www.scichart.com/wp-content/uploads/2023/08/10-reasons-why-scichart-best-javascript-chart-axis-layout.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
<p style="text-align: center;"><em><strong>Above</strong>: SciChart.js <a href="https://demo.scichart.com/javascript-chart-with-multiple-x-axis" rel="noopener">Axis Configuration demos</a>. Many configurations of Axis Layout are possible with SciChart.</em></p>

<h2 id="reason-4">#4 Link Multiple Charts together</h2>
<span style="font-size: 16px;">What if you had a scenario where you need three or four chart panes in a dashboard, stacked one on top of another, but zooming, panning and mouse-over tooltips must be linked together?</span>

<span style="font-size: 16px;">With SciChart.js you can do this. This allows you create custom layouts like our </span><a style="font-size: 16px;" href="https://demo.scichart.com/javascript-multi-pane-stock-charts-sync-technique">financial chart demo here</a><span style="font-size: 16px;">. Zooming or panning on one chart, zooms and pans them all.</span>

One of SciChart’s APIs allows you to link together the mouse interactions of multiple charts, synchronise zooming, tooltips and chart sizes so you can create stacked layouts. Imagine a timeline view of several charts linked together. This flexibility allows you to create novel applications and ways to visualise data.

<video style="aspect-ratio: 1.333;" autoplay="autoplay" loop="loop" muted="" controls="controls" width="100%" height="auto">
<source src="https://www.scichart.com/wp-content/uploads/2023/08/10-reasons-why-scichart-best-javascript-chart-multi-pane.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
<p style="text-align: center;"><em><strong>Above</strong>: <a href="https://demo.scichart.com/javascript-multi-pane-stock-charts-sync-technique" rel="noopener">Multi-pane stock chart demo</a>. Links multiple charts and synchronises cursors, zooming.</em></p>

<h2 id="reason-5">#5 Add many Annotations, Labels to Charts</h2>
<span class="ui-provider fy b c d e f g h i j k l m n o p q r s t u v w x y z ab ac ae af ag ah ai aj ak" dir="ltr">Other Chart libraries won't let you overlay thousands of text labels, markers and annotations on the chart, but with SciChart you can using our rich WebGL <span class="TextRun BCX9 SCXO165846831" lang="EN-GB" xml:lang="EN-GB" data-contrast="auto"><span class="NormalTextRun BCX9 SCXO165846831"><a href="https://www.scichart.com/example/javascript-chart/javascript-datalabels/">DataLabels API</a> </span></span> and <span class="TextRun BCX9 SCXO165846831" lang="EN-GB" xml:lang="EN-GB" data-contrast="auto"><span class="NormalTextRun BCX9 SCXO165846831"><a href="https://www.scichart.com/example/javascript-chart/javascript-chart-annotations/">Annotations API</a></span></span>. </span>

<span class="ui-provider fy b c d e f g h i j k l m n o p q r s t u v w x y z ab ac ae af ag ah ai aj ak" dir="ltr">This means that for complex scientific or engineering applications were your customers need to tag data sources or samples with input values onto the chart surface they can, delivering the product your end users need and setting your application above competitors ensuring success. </span>

<video style="aspect-ratio: 1.333;" autoplay="autoplay" loop="loop" muted="" controls="controls" width="100%" height="auto">
<source src="https://www.scichart.com/wp-content/uploads/2023/08/10-reasons-why-scichart-best-javascript-chart-annotations.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
<p style="text-align: center;"><em><strong>Above</strong>: <a href="https://demo.scichart.com/javascript-chart-annotations" rel="noopener">Annotations demo</a>. Add <a href="https://demo.scichart.com/javascript-datalabels" rel="noopener">text labels</a>, boxes, lines, custom shapes to chart with data or viewport positioning.</em></p>
Annotations can be clicked, selected, resized and dragged. <span class="TextRun BCX9 SCXO165846831" lang="EN-GB" xml:lang="EN-GB" data-contrast="auto"><span class="NormalTextRun BCX9 SCXO165846831">They allow you to <a href="https://demo.scichart.com/javascript-chart-background-annotations" rel="noopener">areas of interest in the background</a> or <a href="https://demo.scichart.com/javascript-chart-color-points-individually-with-paletteprovider">interacting with thresholds</a>, selection boxes and more. </span></span> Data-Labels may be placed on data-points to display the value or custom text. SciChart’s WebGL drawing means you can place thousands of labels, markers or areas of interest without slowdown.
<h2 id="reason-6">#6 Create Scientific 3D Charts</h2>
While most JavaScript chart libraries focus on just 2D visualisations, SciChart.js features 3D Scientific chart types such as 3D Bubble, 3D Point Cloud, 3D Point-line and 3D Surface Mesh.

All can be updated dynamically with big-data, with the performance &amp; reliability that you'd come to expect from SciChart.

<video style="aspect-ratio: 1.333;" autoplay="autoplay" loop="loop" muted="" controls="controls" width="100%" height="auto">
<source src="https://www.scichart.com/wp-content/uploads/2023/08/10-reasons-why-scichart-best-javascript-chart-3d.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
<p style="text-align: center;"><em><strong>Above</strong>: <a href="https://demo.scichart.com/javascript-3d-bubble-chart" rel="noopener">Create 3D Charts</a> with SciChart.js for scientific applications.</em></p>

<h2 id="reason-7">#7 Customise Zooming, Panning Interactions</h2>
<span class="TextRun BCX9 SCXO165846831" lang="EN-GB" xml:lang="EN-GB" data-contrast="auto"><span class="NormalTextRun BCX9 SCXO165846831">Most JavaScript charts allow zooming into the data, but what if you wanted to build specific zooming and panning interactions to match your requirements?
</span></span>

<span class="TextRun BCX9 SCXO165846831" lang="EN-GB" xml:lang="EN-GB" data-contrast="auto"><span class="NormalTextRun BCX9 SCXO165846831">With SciChart we have a number of <a href="https://demo.scichart.com/zoom-pan-multiple-modifiers">zoom, pan behaviours out of the box</a>, and you can create your own. You can combine them together to create an experience like a <a href="https://demo.scichart.com/javascript-realtime-ticking-stock-charts">rich trading application</a> - completely custom with panning on the axis, mousewheel on the chart, drag-selection or drag to pan. Plus, touch is supported out of the box. </span></span>

<video style="aspect-ratio: 1.333;" autoplay="autoplay" loop="loop" muted="" controls="controls" width="100%" height="auto">
<source src="https://www.scichart.com/wp-content/uploads/2023/08/10-reasons-why-scichart-best-javascript-chart-zooming-panning.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
<p style="text-align: center;"><em><strong>Above</strong>: <a href="https://demo.scichart.com/zoom-pan-multiple-modifiers" rel="noopener">Multiple zoom, pan operations</a> combined onto a single chart.</em></p>
Sometimes people ask us how to enable zooming only when CTRL is clicked, or how to mouse-wheel the axis rather than drag to zoom.  There is no limit to how you can confirm the zoom and pan operations in SciChart, and this sets it apart from the competition.
<h2 id="reason-8">#8 Modify data by Pointing &amp; Clicking</h2>
<span class="TextRun BCX9 SCXO165846831" lang="EN-GB" xml:lang="EN-GB" data-contrast="auto"><span class="NormalTextRun BCX9 SCXO165846831">Using SciChart's APIs you can create behaviours to modify curves on point &amp; click. For example in a scientific application where you have to click &amp; drag a curve to change the input somewhere else in your application like in this <a href="https://demo.scichart.com/javascript-heatmap-interactions">interactions demo</a>.</span></span>

<span class="TextRun BCX9 SCXO165846831" lang="EN-GB" xml:lang="EN-GB" data-contrast="auto"><span class="NormalTextRun BCX9 SCXO165846831">Maybe your application needs a level of interaction which is difficult to achieve elsewhere?</span></span>

<video style="aspect-ratio: 1.333;" autoplay="autoplay" loop="loop" muted="" controls="controls" width="100%" height="auto">
<source src="https://www.scichart.com/wp-content/uploads/2023/08/10-reasons-why-scichart-best-javascript-chart-modify-data.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
<p style="text-align: center;"><em><strong>Above</strong>: <a href="https://demo.scichart.com/javascript-heatmap-interactions" rel="noopener">Heatmap Interactions Demo</a>. Point and click/drag the bottom left chart to update data. Drag lines or boxes in the top chart to update simulation inputs.</em></p>
Try the above <a href="https://www.scichart.com/example/javascript-chart/javascript-heatmap-chart/">JavaScript Heatmap demo</a>, try clicking and dragging on the bottom left chart. Also, the annotations (boxes, lines) are editable and change the inputs into the double-slit wave simulation.
<h2 id="reason-9">#9 Style &amp; Animate Absolutely Everything</h2>
<span class="TextRun BCX9 SCXO165846831" lang="EN-GB" xml:lang="EN-GB" data-contrast="auto"><span class="NormalTextRun BCX9 SCXO165846831">From the background, to axis areas, labels, have image or <a href="https://demo.scichart.com/javascript-chart-transparent-background">transparent backgrounds</a> and <a href="https://demo.scichart.com/javascript-chart-styling-theming-in-code">custom themes</a>, SciChart can be styled to match your application easily. We provide <a href="https://demo.scichart.com/javascript-chart-themes">themes out of the box</a> and you can <a href="https://demo.scichart.com/javascript-chart-styling-theming-in-code">create your own</a> with our simple API.</span></span>

<video style="aspect-ratio: 1.333;" autoplay="autoplay" loop="loop" muted="" controls="controls" width="100%" height="auto">
<source src="https://www.scichart.com/wp-content/uploads/2023/08/10-reasons-why-scichart-best-javascript-chart-style-animate-anything.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
<p style="text-align: center;"><em><strong>Above</strong>: One of many <a href="https://demo.scichart.com/javascript-chart-themes" rel="noopener">styling and theming</a> examples showing how you can customise SciChart.js.</em></p>
Everything can be styled in SciChart, as well as anything can be animated. From dataset animations to style animations to custom animations.
<h2 id="reason-10">#10 Have a Fully Documented Library, Rich Demos and Enterprise Tech Support</h2>
Open source and free chart libraries are very popular, but one of the benefits of choosing a commercial library like SciChart is it has hundreds of pages of <a href="https://scichart.com/javascript-chart-documentation">hand-written documentation</a> covering every feature. You won’t have figure it out from the JSDocs and there are samples for everything.

Another of the benefits of using SciChart.js is that we're always working on improving our <a href="https://scichart.com/javascript-chart-documentation">documentation</a>, <a href="https://demo.scichart.com/">demos</a> and <a href="https://github.com/abtsoftware/scichart.js.examples">code samples</a>, and recently added <a href="https://www.scichart.com/blog/documentation-snippets-creating-the-best-experience-for-javascript-developers/">embedded codepen samples into the documentation</a> itself. If there's a feature or idea you want to understand further, just click the 'Edit in Codepen' button and modify to your heart's content.

<img class="alignnone size-full" src="https://www.scichart.com/wp-content/uploads/2023/03/codepen-embeds-scichart-js-documentation.gif" width="1366" />

What's more, our commercial licenses come with <strong>Enterprise Tech Support</strong> that consistently <a href="https://www.scichart.com/why-scichart-world-class-tech-support/" rel="noopener">receives 5-star reviews</a>. Outsource your Charting &amp; Data-Visualization to us and let us handle the stress of customising complex charts in your app.
<h2 id="reason-11">What else makes SciChart.js Different?</h2>
SciChart is performant &amp; reliable enough to be used by <a href="https://www.scichart.com/why-scichart-aerospace-defence/">NASA</a>, it has legendary <a href="https://www.scichart.com/why-scichart-world-class-tech-support/">technical support</a> and is backed by a team of experts. Enterprise Tech Support is the #1 reason you should consider a commercial chart library over open source. Plus, our team is always innovating and making the library faster, leaner and more feature rich and stable.

We're creating a library that will make you (the developer) look good when you include your charts in your app and will delight your users. With you feedback and your custom we can make it even better!
<blockquote>
<h2>Start using SciChart.js Today</h2>
SciChart.js is now available with a <a href="https://www.scichart.com/getting-started/scichart-javascript"><strong>FREE community edition</strong></a> (no trial, sign-up or credit card required) where you can try out the library commercially or use it in a non-commercial application.

If you have a question, or would like to give feedback, contact us.
<p style="text-align: center;"><a class="button" href="https://scichart.com/contact-us">CONTACT US</a><a class="button" href="https://www.scichart.com/getting-started/scichart-javascript/">GET SCICHART.JS FREE</a></p>
</blockquote>