Highcharts JS: The Source-Available JavaScript Charting Framework

What Highcharts Is and Who It Is For

Highcharts JS is a JavaScript charting framework that renders charts using SVG, with fallback to canvas and WebGL for performance-intensive cases. It covers line charts, bar charts, scatter plots, pie charts, area charts, financial candlestick charts, map-based charts, Gantt charts, and data grid views, each served through separate products under the Highcharts family.

The library targets front-end engineers and data teams who need interactive charts in a web application and want pre-built chart types rather than building from SVG primitives. The API-driven configuration model, in which charts are defined with a JavaScript options object, lets non-specialists add charts to an application without deep knowledge of SVG rendering.

Highcharts is source-available, not open source. The source code is on GitHub and readable by anyone, but the license at shop.highcharts.com controls commercial use. Non-commercial projects, personal websites, and companies with annual revenue below a threshold defined in the license terms qualify for free use. Commercial SaaS products and enterprise applications require a paid license.

The Highcharts Product Family

The highcharts/highcharts repository is the working source for multiple related products. The package.json build scripts expose them through separate Gulp targets and test configurations. The product lines visible in the repository are:

- Highcharts: the core charting library for standard chart types. - Highcharts Stock: charts for financial time-series data, including candlestick and OHLC charts. - Highcharts Maps: geographic chart rendering with GeoJSON and TopoJSON data. - Highcharts Gantt: project timeline charts. - Highcharts Dashboards: a layout system for combining multiple charts and data grids in a single page. - Grid Lite and Grid Pro: data grid components included in the Dashboards product.

The repository README distinguishes the working repository from the distribution package. End users who want to include Highcharts in a project are directed to the npm distribution package or to the CDN, not to this repository. This repository is for engineers who want to modify the source, build custom bundles, or contribute to the codebase.

Installing Highcharts: CDN, npm, and Custom Builds

For most web projects, the simplest inclusion is the CDN:

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

For projects that use npm:

npm install --save highcharts

The README also describes ES6 module, AMD, and CommonJS patterns and points to the installation documentation at highcharts.com/docs/getting-started/installation for details on each.

For native iOS applications, Highcharts provides a community-maintained wrapper at highcharts/highcharts-ios. The README describes this wrapper as currently community-maintained rather than first-party supported.

To reduce file size for production, the README describes creating custom Highcharts builds. This allows combining only the modules a project uses into a single file, avoiding loading code for chart types or features not in use. The documentation for this process is at highcharts.com/docs/getting-started/how-to-create-custom-highcharts-packages.

The distribution package at npm is the right package for production use. Referencing the working repository directly in a project is not the intended use.

Building and Developing the Highcharts Source

The highcharts/highcharts repository is set up for contributors who want to modify the source code. Highcharts uses Gulp as its build system. After installing Node dependencies, running gulp sets up a watch task:

npm install
gulp

With the watch running, any change to files in the /js or /css directories triggers a rebuild and saves the output to the code/ directory. The repository also includes a lint task via gulp lint.

Developers on Apple M-series CPUs (ARM64 macOS) may encounter build failures with node-canvas, which requires native compilation. The README documents the fix:

brew install pkg-config cairo pango libpng jpeg giflib librsvg pixman

API documentation can be generated locally by running npx gulp jsdoc-watch, which also starts a local server to browse the generated documentation.

The test suite runs with Playwright across multiple product configurations (Highcharts, Dashboards, Grid Lite, Grid Pro) as well as QUnit for unit tests. The repository's tsconfig.json files and TypeScript source in ts/ indicate the codebase uses TypeScript, with built JavaScript output committed to the code/ directory.

Highcharts vs. D3.js

D3.js is a widely known JavaScript library for data visualization that takes a different approach than Highcharts. D3 provides low-level data binding and SVG manipulation primitives. Building a line chart with D3 requires writing scale functions, axis generation, and path rendering explicitly. Highcharts provides the chart as a preconfigured component that accepts a data series and an options object.

D3 is MIT-licensed and free for all use, commercial or otherwise. Highcharts requires a commercial license for production SaaS or enterprise applications. Teams that need full control over rendering and have the JavaScript expertise to write custom visualization logic may prefer D3. Teams that need to ship charts quickly across a range of types and have budget for a license will find Highcharts's options API faster to work with.

A meaningful difference is maintenance surface. D3 requires the application developer to own the rendering code. Highcharts owns the rendering; the developer configures it. This means Highcharts chart type bugs are fixed upstream, while D3-based visualizations require the application team to identify and fix rendering issues themselves.

Using Highcharts in React and Angular

The Highcharts repository includes sample configurations and TypeScript type definitions that support integration with front-end frameworks. The samples/ directory contains tsconfig files for Highcharts, Stock, Maps, and Gantt variants, and the repository's test setup includes Playwright configurations for these product lines.

For React, Highcharts provides an official wrapper package (highcharts/highcharts-react-official), which is a separate repository. The integration pattern involves importing Highcharts from the npm package, importing the wrapper component, and passing a chart options object as a prop. The repository referenced here (highcharts/highcharts) is the core library, not the React wrapper.

For Angular, similar wrapper packages exist for adding Highcharts to Angular component templates. The README in this repository points to the npm distribution package as the correct starting point for all framework integrations rather than the working repository source.

Licensing and Maintenance

The repository's license.txt file covers the Highcharts source code. Highcharts is classified as source-available: the code is public but use in commercial products requires purchasing a license. The licensing page at shop.highcharts.com defines the tiers and conditions. The README states that non-commercial projects may use Highcharts for free.

This licensing model has a practical implication for open-source software that uses Highcharts as a dependency: if the consuming project is distributed commercially, a Highcharts license is needed. Libraries that wrap Highcharts for redistribution must confirm their license arrangement with Highsoft AS.

The last push to the repository was on 2026-09-25. The package.json version is 13.0.2, indicating stable versioned releases are maintained. Highsoft AS (the company behind Highcharts) provides paid support through highcharts.com/support, which is separate from GitHub issues.

Editorial conclusion

Highcharts is a well-suited choice for teams that need a broad range of chart types, a mature API, and commercial support, and who are willing to budget for a license. Open-source projects and personal use qualify for a free license under the project's terms. Teams building financial dashboards or geographic maps will find relevant products in the Highcharts family: Highcharts Stock for time-series financial charts and Highcharts Maps for geographic visualization. Teams who need a fully permissive license and are prepared to write more rendering code should evaluate D3.js instead. Before adopting Highcharts, verify your use case against the license tiers at shop.highcharts.com, since the definition of commercial use determines which license tier applies.

Frequently asked questions

Official sources

1. highcharts/highcharts on GitHub
2. Issues
3. Project website
4. README