Highcharts 教程
1. Highcharts 教程 2. Highcharts 环境配置 3. Highcharts 配置语法 4. Highcharts 曲线图 5. Highcharts 区域图 6. Highcharts 条形图 7. Highcharts 柱形图 8. Highcharts 饼图 9. Highcharts 散点图 10. Highcharts 气泡图 11. Highcharts 动态图 12. Highcharts 组合图 13. Highcharts 3D图 14. Highcharts 测量图 15. Highcharts 树状图(Treemap)

Highcharts 环境配置

Highcharts 环境配置

本章节我们将为大家介绍如何在网页中使用 Highcharts。

本教程将 Highcharts 与 jQuery 结合使用,所以在加载 Highcharts 前必须先加载 jQuery 库。

如果你对 jQuery 不熟悉,可以参阅本站的jQuery 教程


安装 jQuery

jQuery 安装可以使用以下两种方式:

  • 1、访问 jquery.com 下载jQuery包。
  • 2、使用 Staticfile CDN 静态资源库的jQuery资源:

    http://cdn.staticfile.org/jquery/2.1.4/jquery.min.js
  • 3、使用百度静态资源库的jQuery资源:

    http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js

使用下载的方式

使用下载的方式,在 HTML 页面引入 jQuery 代码:


<head>

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

</head>

使用 CDN(推荐)

使用 Staticfile CDN 静态资源库来加载jQuery库:


<head>

   <script src="http://cdn.staticfile.org/jquery/2.1.4/jquery.min.js"></script>

</head>


安装 Highcharts

Highcharts 安装可以使用以下两种方式:

使用下载的方式(推荐)

使用下载的方式,在 HTML 页面引入 Highcharts 代码:


<head>

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

</head>

使用 CDN

使用官方提供的 CDN 地址:


<head>

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

</head>