彩票走势图

跨平台图表控件AnyChart快速入门教程(十一):系列数据

翻译|使用教程|编辑:吴园园|2019-12-16 13:23:15.503|阅读 229 次

概述:本系列教程将为您介绍如何快速掌握AnyChart,本文介绍了如何进行系列数据处理。

# 慧都年终大促·界面/图表报表/文档/IDE等千款热门软控件火热促销中 >>

相关链接:

AnyChart是基于JavaScript (HTML5) 的图表控件。使用AnyChart控件,可创建跨浏览器和跨平台的交互式图表和仪表。AnyChart 图表目前已被很多知名大公司所使用,可用于仪表盘、报表、数据分析、统计学、金融等领域。重要推荐:

AnyChart现已更新至最新版本8.7.0,九大数据可视化新功能上线,改进了功能并修复了一些bug。新版本,新功能,赶快下载体验吧~(点击查看更新详情

点击下载AnyChart最新试用版

总览

系列是一组数据,可以在图表的图形上看到。系列具有类型,可以随时更改系列数据,当数据集中的数据发生更改或更新系列属性时,您会立即看到更新的可视化效果。

注意:本文包含有关管理图表系列的信息。

加法系列

在大多数情况下,您可以使用以系列类型命名的方法(例如column(),bar(),area()等)创建新系列,并将数据数组或数据集用作该方法的参数。创建多系列图表的另一种方法是:addSeries()方法可以向图表添加任意数量的系列。该方法的数据可以以不同的格式传递:它可以是数据对象的简单数组,数据集或数据视图。您可以传递任意数量的参数来创建任意数量的系列。但是在添加系列之前,您必须定义要添加的系列的类型。addSeries()添加的系列类型由defaultSeriesType()设置 方法。

// set chart typevar chart = anychart.cartesian();
// set default series type
chart.defaultSeriesType("column");
// create series
chart.addSeries(data1, data2, data3);

下面的示例中的所有系列都是使用addSeries()方法添加的。

跨平台图表控件AnyChart快速入门教程(十一):系列数据

识别系列

当您以这种方式添加多个系列时,可能需要获取指向其中一些或全部的链接以进行进一步的调整。您可以使用系列ID或系列索引来执行此操作。

指数

每个系列都有一个索引,该索引可用于获取到系列对象的链接。所述getSeriesAt()方法可用于获得链接到一个系列,它使用系列索引作为参数。索引是由AnyChart Engine自动设置的序列的序列号,不能更改。

// get forth seriesvar series = chart.getSeriesAt(3);
// set series inner color
series.fill("red");

如果您尝试传递的数字超过图表上的序列数,则将返回null。这使得使用while循环调整图表中的每个序列非常方便。这是完成的过程:

// create chartvar chart = anychart.column();
// define default series type
chart.defaultSeriesType("column");
// set data for multiple series
chart.addSeries(data1, data2, data3);
var i=0;// create a loopwhile (chart.getSeriesAt(i)){
  // rename each series
  chart.getSeriesAt(i).name("Series #" + (i+1));
  i++;}

另外,您可以使用getSeriesCount()方法获取图表中的确切序列数,并使用for循环遍历所有序列。请注意,索引始终是连续的,此循环可以随时执行,并且您将始终经历每个系列,就像使用while循环一样。这是完成的过程:

var seriesIndexes = [];for (var i=0; i < chart.getSeriesCount();i++){
seriesIndexes.push(chart.getSeriesAt(i).index());
}

下面的示例演示上面显示的代码。每个系列都被重命名,并且启用了图例以显示修改后的系列名称。

跨平台图表控件AnyChart快速入门教程(十一):系列数据

ID

获取到系列对象的链接的另一种方法是使用系列ID。ID()方法设置了一系列的唯一标识符。设置自定义ID时,可以使用以系列ID作为参数的getSeries()方法来获取到系列对象的链接。

// create chartvar chart = anychart.column();
// create variable for seriesvar series;// create first series
series = chart.column(data1);// set id for the first series
series.id("First Series");// create second series
series = chart.column(data2);// set id for second series
series.id("Second Series");
// get first series
series = chart.getSeries("First Series");// rename first series
series.name("First Series");

拆卸系列

只要可以随时调整或添加任何图表,您还可以删除任何系列。如果您知道应删除的系列的ID,请调用removeSeries()方法并将系列ID用作此方法的参数。在这种情况下,当系列没有ID时,可以使用removeSeriesAt()方法将其删除。removeSeriesAt()方法使用系列索引作为参数,并删除具有给定索引的系列。

// create chartvar chart = anychart.bar();
// create 3 series
chart.addSeries(data0, data1, data2);
// remove third series
chart.removeSeriesAt(2);

除了逐个删除系列以外,您还可以使用一种方法从图表中删除所有系列。调用removeAllSeries()方法从当前图表中删除所有系列。请注意,如果您使用数据集和数据映射-在管理系列和系列数据时原始数据不会丢失,则可以再次创建新的系列使用映射。

跨平台图表控件AnyChart快速入门教程(十一):系列数据

=====================================================

想要购买Anychart正版授权的朋友可以。

跨平台图表控件AnyChart快速入门教程(十一):系列数据


标签:

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@pclwef.cn

文章转载自:

为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
扫码咨询


添加微信 立即咨询

电话咨询

客服热线
023-68661681

TOP