highcharts / highcharts

Highcharts JS, the JavaScript charting framework

Highcharts JS is a JavaScript charting library based on SVG and some canvas/WebGL.

• Official website: www.highcharts.com
• Download page: www.highcharts.com/download
• Licensing: shop.highcharts.com
• Support: www.highcharts.com/support
• Issues: Repo guidelines

Highcharts is a source available product. Please refer to shop.highcharts.com for details on licensing.

Installing and using Highcharts

This is the working repo for Highcharts code. If you simply want to include Highcharts into a project, use the distribution package instead, or read the download page.

Please note that there are several ways to use Highcharts. For general installation instructions, see the docs.

Use our CDN

Instead of downloading, you can use our CDN to access files directly. See code.highcharts.com for details.

<script src="https://code.highcharts.com/highcharts.js"></script>

Install from npm

See npm documentation on how to get started with npm.

npm install --save highcharts

ES6 modules, AMD, CommonJS and others

For other ways to use Highcharts in your projects, please refer to our installation docs.

Create your own custom build of Highcharts

To reduce file size, or combine modules into one file to reduce latency, you may want to create your own build of the Highcharts modules. See Creating custom Highcharts files for more information.

Build and debug

If you want to do modifications to Highcharts or fix issues, you may build your own files. Highcharts uses Gulp as the build system. After npm install in the root folder, run gulp, which will set up a watch task for the JavaScript and CSS files. Now any changes in the files of the /js or /css folders will result in new files being built and saved in the code folder. Other tasks are also available, like gulp lint.

npm install
gulp

Node setup for Apple Mx CPU

When running Node natively on ARM64 MacOS, some Node packages like node-canvas with integrated compiling might fail. Install additional tools to resolve the problem:

• Homebrew and run brew install pkg-config cairo pango libpng jpeg giflib librsvg pixman

Generate API docs

Run in this highcharts repository the doc generator with npx gulp jsdoc-watch, which also starts a new server with the generated API documentation.

highcharts's Issues

Unwanted break in text formatting

Sample: http://jsfiddle.net/CAKQH/182/

Global lang options for exporting module don't take effect

Sample: http://jsfiddle.net/tju9r/

Reported at http://highslide.com/forum/viewtopic.php?f=9&t=6899

Chart plotBorder not supported by IE8

IE8 doesn't render border when using chart.plotBorderWidth and chart.plotBorderColor options.

Reported at: http://highslide.com/forum/viewtopic.php?f=9&t=7047
Demo at: http://jsfiddle.net/EHhGL/1/

IE8 tooltip background takes gradient from series

Reportt: http://highslide.com/forum/viewtopic.php?f=9&t=7109
Demo: http://jsfiddle.net/Tr7nk/207

Disabling single markers bug

Some of the point options applied for specific points in series[X].data don't work.
The options which have beed reported for this bug are: "point.marker.radius: 0" (only 0 doesn't work) and "point.marker.enabled: false". Setting this options in plotOptions.series.marker.radius/enabled works fine.

Reported at: http://highslide.com/forum/viewtopic.php?f=9&t=7070#p33190
Demo at: http://jsfiddle.net/2z3Dm/1/

Destroying chart doesn't clear events when the exporting.js is used

Destroying chart doesn't clear release-selection events of the zoom feature when the exporting.js is included in the document.

Reported at: http://highslide.com/forum/viewtopic.php?f=9&t=7068
Demo at: http://jsfiddle.net/wCXhL/

IE throws error on creating series with empty data array

Error in prepVML due to raw object sent in as shape path

http://jsfiddle.net/txzNQ/

Performance decreases quadratically on increasing number of scatter points

User report:
I need to make a scatterplot with 20000 points and found out, that sorting the zIndex around line 1530 of highcharts.src.js Version 2 takes quadratically increasing more time.
On FF 500 - 2000 points are a little bit slow, but with 4000 or 8000 it takes minutes! And over 10.000 did surpas my patience...

I can do 20.000 points conveniently now, if I comment out the code section before
parentNode.appendChild(this.element);

I didnt see any drawback from commenting the zIndex section. Only the Series in the legend is not visible, which ist easily resolved by setting
legendBorderWith and legendBackground to false.

Proposition:
Maybe you could instead of looping ALL children of the SVG - Graph memorize the elements, which contain a zIndex and just iterate them. This would increase performance on high density plots enormously without loosing the zIndex!

Comment:
Loading a scatter chart with 4000 points takes 20 seconds in Firefox. By removing the zIndex logic, it is reduced to 1.2 second.

Demo: http://highcharts.com/studies/performance.php?seriesType=scatter&chartCount=1&seriesPerChart=1&pointsPerSeries=4000&chartWidth=500&libSource=highcharts.src.js

Missing point events when there is only one point in series.

Reported here: No Tooltip if series has only one Data-Point
Demo here: http://jsfiddle.net/2Czrp/3/

Cursors on legend items blinking between 'pointer' and 'default'

Column appearing as bar

See http://jsfiddle.net/u4XLB/

Tooltips not shown in certain conditions

Description at http://highslide.com/forum/viewtopic.php?f=9&t=6905&view=unread#unread

Sample at http://jsfiddle.net/skrFv/

Chart too wide when rendered to a DIV with a border

Demo at http://jsfiddle.net/deEF4/

Reported at http://highslide.com/forum/viewtopic.php?f=9&t=6948

Single point column gets no width

See http://jsfiddle.net/VtBtP/

Bug when try to disable point hovering

Disabling point hovering through plotOptions.series.states.hover.enabled has no effects. I've tested it on pie and column charts.

Browser click event details not added to the legendItemClick event

Point update causes redraw glitch in stacked column

See http://highslide.com/forum/viewtopic.php?f=9&t=6597 for description

Pie charts rendering incorrectly in mixed chart when a series is hidden

On a mixed chart (column, spline, pie), hiding a series via the legend will cause the pie chart to disappear in Firefox and render incorrectly in Chrome. This can be seen here:

http://jsfiddle.net/xRdu4/

Simply hide any series and you will see the behavior.

Threshold not honoured in certain cases

See description and sample at http://highslide.com/forum/viewtopic.php?f=9&t=6936

Quotes in hash confuse the internal URL pointer for clip and gradients

Reported at: http://highslide.com/forum/viewtopic.php?f=9&t=6959&p=32716#p32716
Demo: http://highcharts.com/examples/line-basic.htm#key=%22value%22

Pie data labels hidden by subsequent slices

Demo at http://jsfiddle.net/GxwZw/1/

Reported at http://highslide.com/forum/viewtopic.php?f=9&t=6949

JavaScript error on removing a series while the tooltip is visible

Demo: http://jsfiddle.net/C3MKa/4/
Report: http://highslide.com/forum/viewtopic.php?f=9&t=6993

1.2: Roundoff error on axis label

http://jsfiddle.net/pmufb/2

Zooming causes image symbols to be mispositioned.

Reported at http://highslide.com/forum/viewtopic.php?f=9&t=7137
Demo at http://jsfiddle.net/VFYq3/

Point hover mis-located when series hidden with legend

When you disable a series that causes the graph to adjust its axis extremes, the hovers for the remaining series are not relocating to reflect the new scale (ignoreHiddenSeries must be set to true). Instead, hover is located where the point should be when all series are showing.

Stacked column with 0 value destroys stack

http://highslide.com/forum/viewtopic.php?f=9&t=6767

Page not reverting to original state after canceling print

In some pages all content disappears

Graph not rendered in Firefox when base tag is present.

Reported at http://highslide.com/forum/viewtopic.php?f=9&t=6878

Notes 2012-01-03:
Demo: http://jsfiddle.net/highcharts/TuMwJ/26/

The problem is that internal URL references in SVG, to gradients and clip objects, are influenced by the base tag.

It also applies to Chrome. There doesn't seem to exist a better workaround than adding the full URI to the reference.

Bug in clip() method of SVGElement.prototype

Bug was reported on http://highslide.com/forum/viewtopic.php?f=9&t=7084#p33266 together with the solution.

Parser issues: double breaks not rendered, hex colors not rendered

Demo: http://jsfiddle.net/bF2h2/8/

Reported at: http://highslide.com/forum/viewtopic.php?f=9&t=6881&view=unread#unread

JS error on destroying pie with data labels

Demo: http://jsfiddle.net/LaGjk/2/
Report: http://highslide.com/forum/viewtopic.php?f=9&t=6975

Better drop mouse handling

Instead of dropping a selection on mouse out of the chart, apply a global event listener for mouse up.

Data labels on pie charts not updating on changed data

See http://jsfiddle.net/Ytjrw/

Reported at http://highslide.com/forum/viewtopic.php?f=9&t=6930

Formatter hyperlink support

We need the ability to format axis labels as hyperlinks so that we can update the application state. Currently it appears that when adding a hyperlink to the formatter output it is stripped out somewhere along the way in the 2.0-prerelease and does not show the axis labels as we would have expected.

http://jsfiddle.net/Q3AGU/23/

Text formatting like <b> or <i> adds space

Demo: http://jsfiddle.net/W95gm/1/

Firefox only does not render whitespace at the beginning or end of a tspan. Therefor a 3px gap is added programmatically in all browsers. Find a better way of doing this.

Pie chart tooltips not hiding on mouse out

Demo at http://jsfiddle.net/mqk8S/

Reported at http://highslide.com/forum/viewtopic.php?f=9&t=6944&view=unread#unread

Errors when recreating chart on resize

If you set up an event handler to recreate a chart on resize, certain sets of chart options will cause an infinite loop of errors and the chart will not redraw. This can be seen here by resizing the window after the chart loads: http://jsfiddle.net/4tLb2/1/

chart.showLoading() causes chart to flicker if the chart is already showing loading.

http://jsfiddle.net/xNuZL/ Small issue that I noticed while some of my buggy code called showLoading() multiple times in a row.

Export utility not including changes made to the data after render time

Demo: http://jsfiddle.net/qX6Kf/

Also test all other dynamic data operations.

Error in extend function in IE8

See http://jsfiddle.net/K4c2R/1/. The error is probably caused by an invalid style value.

Area badly drawn in IE in certain situations with null points.

Demo: http://highcharts.com/cases/issue33.htm

Reported by email.

JS error when background image is set in IE 7 and 8

Demo: http://www.highcharts.com/cases/issue34.htm

Reported at http://highslide.com/forum/viewtopic.php?f=9&t=6931

The error doesn't always happen, but most of the time. Only when using minified jQuery. Accessing document.namespaces is enough to break it. Try adding this to the document.ready event:

console.log(document.namespaces.hcv);

Null values on scatter series causes JS error

http://jsfiddle.net/W95gm/

setExtremes bug

Setting the Y-axis extremes to values (2,12) beyond the original extremes (0,10) seems to re-adjust the extremes to new automatically calculated values. However, setting the min/max padding to 0 seems to resolve this problem and set the extremes to the passed values (2,12). Is there any way to achieve this result without setting the min/max padding to 0.

http://jsfiddle.net/Lru74/

Pie chart with one single 100% point fails to show

http://jsfiddle.net/kfqzP/2/

Axis titles don't show on running addSeries

Description with live examples: http://highslide.com/forum/viewtopic.php?f=9&t=6911&view=unread#unread

Arabic text appearing opposite in Firefox

Demo: http://jsfiddle.net/syMz8/2

Notice that when the chart is exported, the text gets the right direction.

Other SVG implementations not affected.

Pointers:
http://www.w3.org/TR/2002/CR-SVG11-20020430/text.html#RelationshipWithBiDirectionality
http://www.informit.com/articles/article.aspx?p=31799&seqNum=2

Shadows on pie charts

Shadows of slices (plotOptions.pie.shadow) are not rendered on pie charts, although it is listed on Options Reference: http://www.highcharts.com/ref/#plotOptions-pie.

Reported at: http://highslide.com/forum/viewtopic.php?f=9&t=7091

Dragging causes pie slices to disappear in IE7

Report: http://highslide.com/forum/viewtopic.php?f=9&t=7089
Demo: http://jsfiddle.net/highcharts/KSAfE/13/

When using IE7 or IE8 compat, place your mouse cursor over one of the pie slices so that the tooltip pops up. Then, while the tooltip is shown, left-click and hold to drag the chart to another spot. When you drop the box, the slices below the tooltip will disappear.

JS error on showing pie slice with data label

New bug in 2.0.1.

Demonstrated at http://jsfiddle.net/Ytjrw/11/