ichartjs入门简明教程.pdf版

ichartjs入门简明教程

目 录

1. 前言         . 3

文档说明     . 3 1.1.

文档约定     . 3 1.2.

图表术语     . 3 1.3.

感谢语      . 4 1.4.

2. 简介         . 5

what’s the ichartjs?      . 5 2.1.

特点       . 5 2.2.

应用场景     . 5 2.3.

3. 部署与结构      . 6

3.1. 一步部署     . 6

3.2. 组件结构分析         . 6

3.3. 一分钟快速入门之HelloWorld        7

说明     7 3.3.1.

预览     7 3.3.2.

代码     7 3.3.3.

4. 基础篇        . 9

4.1. $符号的含义         . 9

4.2. 数据格式的定义        . 9

单一数据源       9 4.2.1.

多值数据源       9 4.2.2.

4.3. 大小、内边距及边框     . 10

设置图表的内边距         10 4.3.1.

图表的边框       10 4.3.2.

4.4. 对齐方式与偏移量      . 11

设置组件的大小     11 4.4.1.

设置图表的对齐方式        11 4.4.2.

设置图表的偏移量         11 4.4.3.

4.5. 阴影效果     . 11

4.6. 背景色与渐变        . 12

设置背景色       12 4.6.1.

设置渐变        12 4.6.2.

4.7. 字体样式     . 12

4.8. 图表的标题         . 12

4.9. 图表的脚注         . 13

4.10. 过渡动画效果        . 13

4.11. 图例       . 14

开启图例功能      14 4.11.1.

图例的对齐方式     14 4.11.2.

图例的行列布局     15 4.11.3.

图例的行高       15 4.11.4.

图例符号的设置     15 4.11.5.

文字颜色与符号图形颜色一致    16 4.11.6.

4.12. 提示框      . 16

开启提示框功能     16 4.12.1.

固定位置与跟随位置        16 4.12.2.

提示框的渐入效果         17 4.12.3.

4.13. 坐标轴      . 17

坐标轴线        17 4.13.1.

值轴          17 4.13.2.

自定义刻度文本     18 4.13.3.

有效坐标区域      19 4.13.4.

网格          19 4.13.5.

隔行变色        20 4.13.6.

5. 图表篇        . 21

5.1. 饼状图      . 21

2D饼状图       21 5.1.1.

3D饼状图       22 5.1.2.

5.2. 条形图      . 22

2D条形图       22 5.2.1.

2D簇状条形图     24 5.2.2.

5.3. 柱形图      . 24

2D柱形图       24 5.3.1.

2D簇状柱形图     25 5.3.2.

3D柱形图       25 5.3.3.

5.4. 折线图      . 25

2D折线图       25 5.4.1.

5.5. 面积图      . 26

基本面积图       26 5.5.1.

点击下载