antvis/G6


The issue has been closed
数据 - 支持配置远程数据 #4934
Yanyan-Wang posted onGitHub
Issue Hunt 计划(可选)
- 我同意将这个 Issue 参与 Issue Hunt 计划
Issue 难度
中等难度
悬赏
请在 2023 年 9 月 30 日之前完成 PR,10 月 15 日之前完成全部 CR 意见的修改。 AntV 将支付 $20 (汇率按结算当日计)
问题描述
目前 v5 beta 的 graph 配置支持的数据格式有:
// 普通的图数据
export interface GraphData {
nodes?: NodeUserModel[];
edges?: EdgeUserModel[];
combos?: ComboUserModel[];
}
// 树图数据
export type TreeData =
| ITreeData<NodeUserModelData>
| ITreeData<NodeUserModelData>[];
// 普通图数据的 inline 读取方式
export interface InlineGraphDataConfig {
type: 'graphData';
value: GraphData;
}
// 树图数据的 inline 读取方式
export interface InlineTreeDataConfig {
type: 'treeData';
value: TreeData;
}
// TODO:未实现,远程数据获取,应拆分为 type: 'fetch-graphData' 和 'fetch-treeData' 两种,分别对应 FetchGraphDataConfig 和 FetchTreeDataConfig 。
export interface FetchDataConfig {
type: 'fetch';
value: string; // 远程 json 地址,例如:https://assets.antv.antgroup.com/g6/eva-3d.json
}
export type DataConfig =
| GraphData
| InlineGraphDataConfig
| InlineTreeDataConfig
| FetchDataConfig; // 应拆分为 FetchGraphDataConfig 和 FetchTreeDataConfig 两种
然后应在数据控制器(dataController)中解析对应数据(type 为 'fetch-graphData' 和 'fetch-treeData' 的情况):
另外,应当考虑在数据增量更新、替换时的情况。
重现链接
重现步骤
- clone g6 代码
git clone https://github.com/antvis/G6.git
- 拉取所有线上分支
git fetch
- 切换到 v5 分支
git checkout v5
- 进入 g6 包
cd packages/g6
- 安装依赖
npm install
- 启动 demo
npm run dev
- 实现功能、新增 demo 以测试
demo 位于 packages/g6/tests/integration
测试用例的编写以及测试方式参考:https://github.com/antvis/G6/pull/4793
提交代码,等待 CR
根据(多次) CR 建议修改
等待合并入 v5 分支后,管理员支付奖金
预期行为
graph 的 data 配置项支持 fetch-graphData 和 fetch-treeGraphData 两种远程数据获取方式,并进行正确的数据解析和渲染,考虑数据增量更新、全量替换的情况。
PR 中应当包含测试用例、集成测试截图、效果截图等
平台
- 操作系统: [macOS, Windows, Linux, React Native ...]
- 网页浏览器: [Google Chrome, Safari, Firefox]
- G6 版本: [5.0-beta]
屏幕截图或视频(可选)
No response
补充说明(可选)
No response