Highcharts - configuração do ambiente

Neste capítulo, discutiremos como configurar a biblioteca Highcharts para ser usada no desenvolvimento de aplicativos da web.

Highcharts requer jQuery como dependência. Primeiro, vamos instalar a biblioteca jQuery e depois a biblioteca Highcharts.

Instale o jQuery

Existem duas maneiras de usar o jQuery.

  • Download- Baixe-o localmente em jQuery.com e use-o.

  • CDN access- Você também tem acesso a um CDN. O CDN dará a você acesso em todo o mundo a centros de dados regionais; neste caso, o host do Google. Isso significa que o uso do CDN transfere a responsabilidade de hospedar arquivos de seus próprios servidores para uma série de servidores externos. Isso também oferece a vantagem de que, se o visitante de sua página da Web já tiver baixado uma cópia do jQuery do mesmo CDN, não será necessário baixá-la novamente.

Usando o jQuery baixado

Inclua o arquivo jQuery JavaScript na página HTML usando o seguinte script -

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

Usando CDN

Estamos usando as versões CDN da biblioteca jQuery ao longo deste tutorial.

Inclua o arquivo jQuery JavaScript na página HTML usando o seguinte script -

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

Instale Highcharts

A seguir estão as duas maneiras de usar Highcharts.

  • Download- Baixe-o localmente em highcharts.com e use-o.

  • CDN access- Você também tem acesso a um CDN. O CDN dará a você acesso em todo o mundo a centros de dados regionais; neste caso, o host Highcharts - Code.Highcharts.Com.

Usando Highcharts baixados

Inclua o arquivo Highcharts JavaScript na página HTML usando o seguinte script -

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

Usando CDN

Estamos usando as versões CDN da biblioteca Highcharts ao longo deste tutorial.

Inclua o arquivo Highcharts JavaScript na página HTML usando o seguinte script -

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