Highcharts – Environment Setup


Highcharts – Environment Setup


”;


In this chapter, we will discuss how to set up the Highcharts library to be used in web application development.

Highcharts requires jQuery as a dependency. First, we will install the jQuery library and then the Highcharts library.

Install jQuery

There are two ways to use jQuery.

  • Download − Download it locally from jQuery.com and use it.

  • CDN access − You also have access to a CDN. The CDN will give you access around the world to regional data centers; in this case, Google host. This means using CDN moves the responsibility of hosting files from your own servers to a series of external ones. This also offers an advantage that if the visitor to your webpage has already downloaded a copy of jQuery from the same CDN, it will not have to be re-downloaded.

Using Downloaded jQuery

Include the jQuery JavaScript file in the HTML page using the following script −

<head>
   <script src = "/jquery/jquery.min.js"></script>
</head>

Using CDN

We are using the CDN versions of the jQuery library throughout this tutorial.

Include the jQuery JavaScript file in the HTML page using the following script −

<head>
   <script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
   </script>
</head>

Install Highcharts

The following are the two ways to use Highcharts.

  • Download − Download it locally from highcharts.com and use it.

  • CDN access − You also have access to a CDN. The CDN will give you access around the world to regional data centers; in this case, the Highcharts host – Code.Highcharts.Com.

Using Downloaded Highcharts

Include the Highcharts JavaScript file in the HTML page using the following script −

<head>
   <script src = "/highcharts/highcharts.js"></script>
</head>

Using CDN

We are using the CDN versions of the Highcharts library throughout this tutorial.

Include the Highcharts JavaScript file in the HTML page using the following script −

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

Advertisements

”;

Leave a Reply

Your email address will not be published. Required fields are marked *