目录
什么是可视化图表？
组件世界/Widget+Store 的可视化图表功能，目前仅支持 Notion.
简单而言，可视化图表，便是通过 Notion API 所提供的数据接口，根据用户的需要，将特定的 Notion Database 数据生成各种类型的图表。
目前，可视化图表提供了饼状图、柱状图、折线图、Echarts 柱状图、词云图。未来将会支持更多的可视化图表类型。
授权工作区，获取数据
下面以 Notion 为例，介绍「组件世界/Widget+Store」 的可视化图表功能。
数据导入和数据清洗
在正式使用可视化图表功能之前，用户需要准备一份合乎规范的数据表格。
如果你刚导入 Excel 数据/CSV 文件，需要进行基本的数据清洗。数据清洗指识别数据的不完整、不正确、不准确或不相关部分，然后替换、修改、或删除脏数据或粗数据。
具体至 Notion Database，切记删除多余的空白行/列。与此同时，修改属性，将数字列的属性，修改为 Number.
如果你的工作区已经存在设置好的 Database/多维表格，那么，你直接进入 「组件世界/Widget+Store」的可视化图表区域创建小组件即可。
工作区授权
数据授权存在两种方式。
方案一：在「个人设置」处进行配置。
具体操作为「点击昵称 👉 账户设置 👉账户相关 👉 Notion 配置——绑定 Notion」
方案二：在某个新建的小组件内部进行设置。
直接新建某个类型的可视化图表小组件，在小组件的左侧配置面板中，选择绑定Notion 账户。根据操作提示，选择你要授权的 Notion 数据库。
配置图表
图表配置包括两个部分：数据源配置和组件配置。
数据源配置
数据源配置是图表配置的核心。
主要操作：从上到下，先选择你要可视化的「数据库」，随后选择「维度/ X 轴」、「指标/Y 轴」，最后再选择「排序」，指明排序方式。最终，你便可以看到该数据库按照特定维度和指标所生成的图表。
其中，最为关键的是，获取目标数据库的链接 URL.
具体操作步骤如下：
一、打开浏览器，进入网页版 Notion；
二、确定数据源，保证在你授权的目录中拥有一个Notion数据库。
三、进入到数据库页面内，复制浏览器地址栏链接。
四、粘贴地址栏链接至数据源配置中的「数据库」。此时，输入框会智能识别出数据库的id，当然你也可以直接输入数据库id。
比如，地址栏链接为：https://www.notion.so/f5f1b814ed454b39bf67a02d86294636?v=976e4917108e4cc7a8a9d80a02bd87c8. 那么，数据库id为中间的f5f1b814ed454b39bf67a02d86294636.
如果数据库id识别正确，输入框右侧便会显示绿色对勾。
五、根据需求，配置X 轴、Y 轴、排序方式、过滤条件，并查看组件预览效果。
组件配置
如果需要，可以在组件配置区域设置图表的颜色、动画效果等细节，以满足用户的个性化需求。
嵌入组件链接
完成这些设置后，点击右上角的「复制嵌入链接」，粘贴至 Notion 并以网页嵌入「Create embed」的形式呈现，便可看到 Database 所生成的图表。
可视化图表·嵌入效果
可视化图表 GIF 演示·使用教程
可视化图表·视频教程
可视化图表的未来规划
在未来，随着 FlowUs、Wolai 等笔记软件开放 API, 「组件世界 Widget Store」有可能对应提供 FlowUs Chart、Wolai Chart 等服务，将多维表格可视化扩展至相关的生产力工具。
与此同时，可视化图表服务将会提供更多种类、更为复杂、更加强大的的图表生成服务。敬请期待。
参考文献
使用教程·综合介绍
组件世界 WidgetStore 一个丰富、强大的嵌入式小组件库
使用教程· 按照产品分类
可视化图表·使用教程：让你的 Notion Database 数据实现可视化
NotionCn 使用教程——Notion 中文版·汉化方案，支持网页端和客户端
组件世界 Widget Store· 使用案例——将小组件整合至你的笔记软件
使用教程·按照平台分类
Notion 类笔记软件使用教程：使用「组件世界」打造精美、强大的知识库主页
双链笔记使用教程：如何在双链笔记软件中建立仪表盘？以嵌入式小组件库「组件世界 Widget Store」为例，辅助建立强大的知识库
为知笔记使用教程：使用「组件世界 Widget Store」辅助知识管理
GitHub 使用教程：如何使用小组件搭建个性化的 GitHub 主页？以「组件世界 Widget Store」为例
WordPress 使用教程：如何在 WordPress 中使用组件库建立丰富、强大、好看的主页？以「组件世界 Widget Store」为例
[…] 可视化图表·使用教程：让你的 Notion Database 数据实现可视化 […]