开始使用amcharts

Download amcharts eBook

备注

amCharts是一组基于JavaScript的数据可视化库,包括常规图表类型,如Serial,Pie等,以及高级的图表类型和地图。

介绍

在使用amCharts之前,您需要包含必需的JavaScript库。

所有amCharts操作都需要一个主库 - amcharts.js 。它需要首先包含在内并且是强制性的。

每种图表类型都需要图表类型特定的包含。例如串行图表,也需要serial.js ,饼图需要pie.js等。

如果在同一网页上您将显示多种不同的图表类型,则需要包括该页面上显示的所有特定于图表类型的包含。

附加包括

除了主要的功能包括,您可能需要其他包括,如主题和插件。它们分别位于/ themes // plugins /子目录中。

即:

<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="https://www.amcharts.com/lib/3/serial.js"></script>
<script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
<script src="https://www.amcharts.com/lib/3/plugins/dataloader/dataloader.min.js"></script>
 

创建图表

该图表由HTML容器和实例化其中的图表的JavaScript代码组成。

HTML

我们使用<div> 元素作为图表容器。

<div id="chartdiv" style="height: 300px;"></div>
 

JavaScript的

要实例化图表,我们使用AmCharts.makeChart() 函数。第一个参数是放置图表的容器的id,第二个参数是带有图表配置的对象。

它至少必须包含type 参数,它保存图表类型。

<div id="chartdiv" style="height: 300px;"></div>
 

从amCharts CDN加载

AmCharts提供负载均衡,可靠的CDN,用于直接从我们的Web服务器加载库。使用https://www.amcharts.com/lib/3/作为包含的基本URL。

<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="https://www.amcharts.com/lib/3/serial.js"></script>
 

从您自己的服务器加载库

为此,[下载] [1]一个必需的amCharts产品ZIP存档。

解压缩并放在Web服务器上的某个位置。即/ amcharts /子目录。

然后只需使用<script> 标签加载它们:

<script src="amcharts/amcharts.js"></script>
<script src="amcharts/serial.js"></script>
 

Stats

27 Contributors: 3
Tuesday, September 13, 2016
许可下: CC-BY-SA

不隶属于 Stack Overflow
Rip Tutorial: info@zzzprojects.com

下载电子书