统计html页面组件属性,酷屏HTML组件和图表组件详解

当你在一个页面上，需要一个饼图，你是否要去写一个饼图？其实大可不必，有了酷屏，可以节省你50%的辛苦编写饼图的力气。当把一个图形编写成为一个组件时，就可以做到哪里需要就拖拽到哪里，同时可以添加自定义样式和事件。很棒吧，目前酷屏已经内置了两大类组件：HTML组件和图表组件。

一．组件介绍

HTML组件里为了适用大部分普通场景，其中包含了容器类，表格类，菜单树类，参数类，统计图类，特殊的动画效果类等组件，如下图所示。

1.png (8.74 KB, 下载次数: )

2019-10-8 15:53 上传

下面，我们具体来了解一下上面的几类组件。

1)容器类

作用：顾名思义，容器类的组件一般都是作为一个包裹在外层的容器，通常起到一个容器和修饰样式的作用。

作用场景：当我们想要把一个或者多个组件放置在同一个区域，使得该部分组件形成一个整体，同时通过改变整体的位置或者大小或者删除，对所有组件都起到控制作用，也可以对容器的样式进行编写，达到美观修饰的目的。

作用图如下：

2.png (653.5 KB, 下载次数: )

2019-10-8 15:53 上传

2)表格类

作用：表格类的组件，一般都是拥有特殊功能(如滚动，翻页，切换，变长等)和美丽外观(只有想不到，没有做不到)的表格，同时兼具表格的作用，使数据条理化，系统化。

作用场景：当你需要一个表格来详细的展现数据时，你可以去表格类组件里去寻找合适自己的表格，或功用或美观或二者兼顾。

3.png (6.82 KB, 下载次数: )

2019-10-8 15:53 上传

3)参数类

作用：参数类的组件可以实现统计图联动，统计图联动。

作用场景：当你想要你的选择项发生变化时，相关联的图表也发生相应的变化；或者希望选择项发生变化时，表格也进行联动；这时你需要一个参数类的组件(下拉框，复选框，切换按钮等)来完成你的想法。

4.png (25.37 KB, 下载次数: )

2019-10-8 15:53 上传

5.png (16.09 KB, 下载次数: )

2019-10-8 15:53 上传

4)统计图类

作用：统计图类组件，即各类统计图(条形图，柱状图，饼图，地图等)，但比常规的统计图更加炫酷多样。

作用场景：在任何需要使用到统计图的场景，如果常规的统计图已经没法满足需求你的要求，这时就可以到该类统计图里物色一下。

6.png (11.66 KB, 下载次数: )

2019-10-8 15:53 上传

7.png (206.2 KB, 下载次数: )

2019-10-8 15:53 上传

二．使用诀窍

看完这些方便又极其好看的组件，是不是想要快速去使用它呢？下面我们就说它是怎么用的，以统计图类为例。

1)第一步：简而言之，言而总之，轻轻一拖，效果立现。

8.png (44.09 KB, 下载次数: )

2019-10-8 15:53 上传

2)   第二步：关联数据，创建分析表，取出展示数据和指标。

1.   根据要展示的数据指标，做一张分析表

9.png (4.18 KB, 下载次数: )

2019-10-8 15:53 上传

2.   根据要展示的指标，拾取表元指标，根据数据格式写表达式，到此关联数据结束。

10.png (24.13 KB, 下载次数: )

2019-10-8 15:53 上传

3)   第三步:预览效果

11.png (20.56 KB, 下载次数: )

2019-10-8 15:53 上传

有言道，工欲善其事，必先利其器。比喻要做好一件事，准备工作非常重要。所以要想做出一张完美的大屏，那么制作这张大屏的工具也需要相同的优秀。这可能就是亿信酷屏被反复选择的原因。我始终相信，所有相遇都是假期未晚！