可视化的标签系统

目标

做一个自然语言搜索AIGC可视化、自然语言配置可视化的功能。

需求

参考:https://github.com/ppchart/ppchart

  • 数据抓取(包括图片的抓取和转存)
  • 数据清洗
  • 特征识别
  • 打标签

数据抓取脚本:
https://github.com/zhouchangju/dataset/tree/main/webCrawler

几个问题

我们需要多少类、多少个组件才能满足业务需求?

核心:将业务-数据-图表的关联关系理清楚。
构建一个金融可视化的知识图谱?

这个问题涉及可视化的分类体系,是体现可视化专业性的核心问题。
目前常见的分类体系:

  • ECharts
  • AntV
  • Mermaid
  • Vega

分类包括:

  • 业务的分类(有限)
  • 数据的分类(有限)
  • 图表的分类(有限)
  • 意图的分类(较多,一般和业务分类是关联的)

山海鲸可视化(零代码数字孪生可视化平台):
https://www.shanhaibi.com/baike/v1/eaqn1kn9rhlivkhw/

可视化分类:
https://datavizcatalogue.com/ZH/%E6%90%9C%E7%B4%A2.html

FineBI:
https://www.finebi.com/visualization/bi-tbksh

互联网人要了解的数据可视化:
https://www.woshipm.com/pd/2906131.html

TradingView的组件

详见TradingView的Widgets
公司的同事已经对TradingView的组件进行了统计,详见这个文档,这是设计稿
结论:196基础组件 + 195业务组件
其中可视化的部分归属到业务组件,并不是很多,具体列表如下(2025.06.12更新):
可视化的标签系统

2025.06.19:我让海外同事先整理下半年需求了。

初衷

给 Make a pie 的例子打标签,转为我们的用例。

方案

  • 问下资讯的标签系统怎么搞的、分为几个纬度。

  • 之前有个文生图的论文,涉及一些分类,可以看下。

图像识别

基于YOLO进行训练。
https://github.com/WongKinYiu/yolov7
https://docs.ultralytics.com/zh/

1
yolov可以用来识别ECharts图表中的组件么,比如axisPointer、markpoint等

维度

Prompt:

1
2
3
4
我想给1000个现有的ECharts的Demo添加分类标签,以便在使用的时候能快速定位到合适的Demo。
如下是我的标签分类和每个分类给出的部分示例标签。
请帮我看下这些分类是否足够,如果不够请帮我补充一下。
注意:一个Demo可以同时拥有多个标签。

业务域分类

股票、基金、期货、销售、人事、财务、运营、客户管理、供应链、风险管理、合规监管、研发管理、项目管理、质量管理
周昌炬列一下,企业库、宏观分析、F10这种、组织架构

业务功能

产业链、股权关系、资金流向、高管信息、组织架构、业务流程、风险评估、绩效分析、市场分析、竞品分析、用户画像、运营指标、财务分析、投资决策

得根据实际业务去拆分:周昌炬去拆分

目的

对比、趋势、分布、比例、关系、概念、流程或移动、范围、排名、异常检测、预测、聚类、分类、组成、演化、周期性、季节性、地理分析、时间分析
去掉AI生成的。

图表类型

折线图、柱状图、象形图、散点图、饼图、地图、雷达图、k线图、热力图、关系图、矩形树图、桑基图、漏斗图、仪表盘、面积图、瀑布图、玫瑰图、平行坐标图、盒须图、小提琴图、词云图、力导向图、弦图、日历图、极坐标图、河流图、蜂窝图、甘特图

数据

格式:
二维表格、关系(层次结构)、文本
数据特性:
数据维度:低维数据、高维数据
时空数据:时间序列、空间数据、地理数据
数据格式:流式数据
业务特征:历史数据
数据粒度:连续数据、离散数据

控件

axisPointer、legend、axis、grid、datazoom、brush、visualMap、tooltip、toolbox,timeline、graphic、calendar、title、marker(markLine、markPoint)

视觉

布局(用功能替代掉):
上中下布局、左中右布局、时间轴?多图表?图例布局、四角布局、环状布局

特性(根据之前的范式组件的设计稿的概念去补充):
边距、间隙、背景、阴影、渐变、圆角、字体、标记、颜色、透明度、边框、图案、纹理、符号、图标、装饰、对齐、排版、层级

交互

点击、hover、缩放、联动、拖拽、框选、双击、键盘快捷键、滚动

动画

入场、过渡、时间轴、形变、退场、循环、缓动、延迟、帧动画、路径动画、粒子动画

颜色风格

草图、科技、商务、极简、扁平、拟物、暗色、亮色、高对比、色盲友好、品牌色、季节色、情感色、数据色

自定义

3D、创意、自定义图形、自定义组件、自定义布局、自定义主题、自定义动画、自定义交互、扩展插件、二次开发、模板系统

技术特性分类

  • 3D效果、自定义组件、多图联动、异步数据加载、主题定制等

代码结构特征

  • 数据源类型:静态数据、动态数据、增量数据、外部API、CSV/JSON导入
  • 配置复杂度:基础配置、中等复杂、高级定制
  • 动画效果:无动画、入场动画、交互动画、实时更新动画
  • 响应式:固定尺寸、自适应、移动端优化

创意 Demo

看到第 10 页
https://www.makeapie.cn/echarts_10.html?rank=2

K 线股票图表(matols.com)
https://www.makeapie.cn/echarts_content/xByOFPcjBe.html

公交线路实时进度
https://www.makeapie.cn/echarts_content/xByj7eOSMx.html

玉玦图 + 单轴
https://www.makeapie.cn/echarts_content/xHkrEgRvQg.html

(大屏)传感器布设平面图
https://www.makeapie.cn/echarts_content/x2Z4NzPSRh.html

新年烟花
https://www.makeapie.cn/echarts_content/xHyRFHJYDe.html

孤帆远影碧空尽,唯见长江天际流
https://www.makeapie.cn/echarts_content/xSkkgklwdg.html

俄罗斯方块
https://www.makeapie.cn/echarts_content/xrkJZ2pfeZ.html

SVG Path 老鼠+水波(注释里面讲了一个 SVG 工作流,值得参考)
https://www.makeapie.cn/echarts_content/xlrO8rm-4.html

ECharts 水球图(插件机制)
https://github.com/ecomfe/echarts-liquidfill

美国疫情地图+动态排名柱状图:
https://www.makeapie.cn/echarts_content/x02yMqYpqC.html

动态金字塔:
https://www.makeapie.cn/echarts_content/xRQpCsH8Ci.html

天干地支 Pie:
https://www.makeapie.cn/echarts_content/xdO-Dq6iEj.html

资料

1 dataset 100 datavisualizations:
https://datavizproject.com/#
https://100.datavizproject.com/