我的位置：首页 › 一站式数据分析平台-亿信ABI › 亿信ABI-辰哥课堂 › ABI-DEMO解析第一期：智慧金融之股票行业 ...

ABI-DEMO解析第一期：智慧金融之股票行业

复制链接 | 收藏本帖

3571

: wut 数据老手Lv5

发表于2020-4-23 18:30

楼主

本帖最后由 wut 于 2020-9-21 15:03 编辑

一、页面一览

二、页面分析
1、整体框架
主题表：使用rand()函数产生随机数
页面结构：宽百分比，高固定，自定义布局
布局背景：设置背景图片+自定义样式（background-size:100% 100%）

布局标题：由图片直接展示，设置图片路径+自动撑满

2、模块详解
1）股基速览
a）整体介绍：图片+词云图，用于展现热门类型的股票

b）词云图：设置展示的词组

2）基本信息
四个指标卡：一个大容器套四个标题容器，单个标题容器中，由图片+文本组成

饼图
a）统计图类型：南丁格尔玫瑰图

b）设置圆半径

c）设置数据标志

3）K线图
由k线图+双系列线状图两个统计图叠加而成。

4）复权单位净值
三个按钮
a）按钮属性设置
分组名：1，三个按钮构成一个按钮组
自定义样式：background-color:#093776;color:#05FCFF
选中自定义样式：background-color:#09689F;color:#05FCFF

b）设置钻取
热区联动统计图，并且通过传递参数来控制数据展示的时间范围

c）面积图
折点设置：

系列颜色：设置90%透明

5）组合特征
双系列柱状图

6）仓位变化
由两个分析区表格组成，两个表格都设置水平撑满；
表体表格属性设置背景图片和自定义样式（background-size:100% 100%;）

三、配色信息
1、标题文本+指标卡文本：#ffffff
2、饼图颜色：#0090FF,#04FFFB,#27FF95,#DCD40F
3、k线图：阳线：#25da64；阴线：#ff5554
4、双系列线状图
系列颜色：#00f3f6，#ffd216
网格颜色：#162548
坐标轴颜色：#00a8ff
轴标签字体：#00ffff，12px
5、面积图：#00ffff，90%透明
6、双系列柱状图
系列颜色：#1b48d9（50%），#1df0f3（50%）
坐标轴颜色：#00a8ff
轴标签字体：#00ffff，12px
7、表格
字体颜色：#3dd8ff，12px

四、资源文件
1、报表资源