Installation

Install via NPM

One of the ways of adding the Highcharts Dashboards to your web page is via npm script. You can get all Dashboards functionality in the package, which can be installed using the following script:

npm install @highcharts/dashboards

Then import the package in your project:

import * as Dashboards from '@highcharts/dashboards';

Include Dashboards by script tag

Include the JavaScript files in the <head> section of your web page as shown below.

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

Load files from your domain

In the example above the Javascript files are loaded from code.highcharts.com but you can download the files from highcharts.com and include them on your web page. Here is an example with Highcharts Dashboards served from your own server:

<script src="../code/dashboards/dashboards.js"></script>

Load additional modules

There are some additional modules that you might want to include in your webpage that are not included in the basic dashboards.js module. The basic module lets you create the elementary dashboard with HTMLComponents, but if you would like to use some predefined component types, you need to add the necessary modules. E.g. to use a Highcharts component, you need to add the following scripts:

../dashboards/dashboards.js
../dashboards/modules/dashboards-plugin.js
../highcharts.js

Get started

Now you are ready to use Dashboards. Check out Your first Dashboard to get started.

Edit this page