作用与效果

3D Echart 是一种能够直观展示数据的图表工具，特别适合需要在三维空间内展示数据的场景，例如展示城市和年份维度的数据变化。

如何使用 3D Echart

需要先在数据库中创建数据模型。数据模型应该包含你要展示的数据字段，比如城市名称、年份和相应的数据值（例如人口、销售量等）。
1.2 导入数据：
将创建好的数据文件导入到数据库中。例如，可以通过Excel表格或者其他数据源来导入这些数据。点击这里下载 Excel 文件
2. 发布代码组件库并导入项目

2.1 操作步骤：
根据官方文档中的指引，发布代码组件库。可以参考文档链接来完成这一操作。
2.2 导入项目：
成功发布代码组件库后，将其导入你的项目，以便在页面中使用这些组件。
3. 添加组件到页面

3.1 添加三个组件：
在页面中，需要添加以下三个组件来完成3D Echart的配置：
Bar3DEchart：这是核心的3D图表组件，负责展示你的数据。
数据选择器（城市）：用于选择具体的城市。
数据选择器（年份）：用于选择具体的年份。
3.2 配置方式：
数据选择器-城市：选择并配置该组件，确保其可以根据用户选择的城市数据进行展示。
数据选择器-年份：类似于城市选择器，这个组件用于选择年份。
Bar3DEchart：将图表组件添加到页面，并确保其与数据选择器的值联动显示。

如果你希望修改3D Echart的数据来源，比如从其他数据库切换到你指定的数据库，可以按照以下步骤操作。请注意，这部分需要具备一定的 TypeScript (TS) 代码基础，并能使用 GraphQL (GQL) 查询数据。操作步骤：

获取数据库数据：
- 打开文件路径：src->components->Bar3DEchart-db.ts。
- 在此文件中找到 getData 函数，并根据你的数据库结构修改其中的 GraphQL 查询（gql）。
修改数据处理部分：
- 打开文件路径：src->components->Bar3DEchart->processData.ts。
- 根据新的数据库字段结构，调整数据类型定义和数据提取逻辑，以适应新数据库中的数据格式。
修改数据显示部分：
- 打开文件路径：src->components->Bar3DEchart->option.ts。
- 修改 fetchAndProcessData() 函数的结果赋值，确保处理后的数据能够正确展示在图表中。
本地部署查看效果：
- 在终端中运行命令 npm run dev，启动本地开发环境，查看是否配置正确。
发布：
- 当所有修改验证完成后，使用命令 functorz publish 将其发布。

3D Echart 使用的是 Apache ECharts 提供的图库。如果你想修改图表的样式或类型（例如从柱状图更改为其他类型图表），可以参考 ECharts 文档并根据其说明修改 option.ts 文件中的配置。