Highcharts图表插件的使用说明

一、 简介

1. Highcharts 是一个用纯JavaScript编写的一个图表库。(使用时需要机遇JQuery来使用)

2. Highcharts 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表

二、 特点

1. 兼容性 - 支持所有主流浏览器和移动平台(android、iOS等)。

2. 多设备 - 支持多种设备,如手持设备 iPhone/iPad、平板等。

3. 免费使用 - 开源免费。

4. 轻量 - highcharts.js 内核库大小只有 35KB 左右。

5. 配置简单 - 使用 json 格式配置

6. 动态 - 可以在图表生成后修改。

7. 多维 - 支持多维图表

8. 配置提示工具 - 鼠标移动到图表的某一点上有提示信息。

9. 时间轴 - 可以精确到毫秒。

10. 导出 - 表格可导出为 PDF/ PNG/ JPG / SVG 格式

11. 输出 - 网页输出图表。

12. 可变焦 - 选中图表部分放大,近距离观察图表;

13. 外部数据 - 从服务器载入动态数据。

14. 文字旋转 - 支持在任意方向的标签旋转。

三、 支持的图表类型

四、 Highcharts使用准备(环境配置)

1. 准备JQuery的js文件

1. 下载链接(jQuery 3.2.1)

开发版:https://pan.baidu.com/s/1jHG7f6Y 密码:7vzj

产品版:https://pan.baidu.com/s/1qYzajbI 密码:cv7h

2. 下载Highcharts的文件(文件中包含插件使用所需要的JS文件及CSS文件,以及所有图表的使用案例)

1. 下载链接https://pan.baidu.com/s/1nvL0VhR 密码:6pc3

五、 Highcharts的图表配置(案例描述以折线图为例)

1. Highcharts 基本组成

2. 案例

六、 Highcharts中文API

API的网址:https://api.hcharts.cn/highcharts

  • 发表于:
  • 原文链接:http://kuaibao.qq.com/s/20180104G0IR3U00?refer=cp_1026

扫码关注云+社区