deer-flow chart-visualization 技能实战双轴图generate_dual_axes_chart参数规范与调用链路【免费下载链接】deer-flowAn open-source long-horizon SuperAgent harness that researches, codes, and creates. With the help of sandboxes, memories, tools, skill, subagents and message gateway, it handles different levels of tasks that could take minutes to hours.项目地址: https://gitcode.com/GitHub_Trending/de/deer-flow本文以 deer-flow 技能库chart-visualization中的双轴图参考文档为核心完整梳理generate_dual_axes_chart的输入字段、默认值与使用约束并结合技能入口 SKILL.md 与执行脚本 generate.js 的源码说明一份双轴图 spec 从 Agent 组装参数到输出图像 URL 的完整调用链。读完后你可以直接编写可运行的双轴图 payload并理解其在技能流水线中的角色与适用边界。1. 双轴图的定位趋势与对比同屏展示双轴图dual-axes的核心能力是在同一画布上叠加柱状与折线或两条不同量纲的曲线用于同时展示趋势与对比典型场景如营收 vs 利润、温度 vs 降雨。从 SKILL.md 的图表选择指南可以看到generate_dual_axes_chart被明确归入Time Series时间序列一类且只在两个序列量纲不同two different scales时才被推荐选用Time Seriesgenerate_line_chart趋势或generate_area_chart累积趋势量纲不同的两个序列则用generate_dual_axes_chart。这意味着双轴图不是普通折线图的替代而是解决两条曲线无法共用同一 Y 轴这一特定问题的图表类型。2. 输入字段规范以下内容完整继承自参考文档 generate_dual_axes_chart.md并在参数说明中补充了与技能整体约定一致的取值细节。2.1 必填字段字段类型说明categoriesstring[]按顺序提供 X 轴刻度如年份、月份、品类seriesarrayobject每项至少包含typecolumn/line与datanumber[]长度必须与categories一致可选axisYTitlestring描述该系列 Y 轴含义两点关键约束值得注意series[].data的长度必须与categories一致否则无法对齐 X 轴刻度axisYTitle是系列级字段而非顶层字段这正是双轴语义的体现——每个系列可以声明自己所属 Y 轴的含义左轴与右轴各自独立标注。与同目录其他图表参考如 generate_column_chart.md 使用扁平data: arrayobject相比双轴图采用categories series的结构化数据形态这是多系列图表如 line、dual-axes 类共用的数据约定。2.2 可选字段字段类型默认值说明style.backgroundColorstring—自定义背景色style.palettestring[]—配置多系列配色style.texturestringdefault可选default/roughthemestringdefault可选default/academy/darkwidthnumber600画布宽度heightnumber400画布高度titlestring图表标题axisXTitlestringX 轴标题可选字段在chart-visualization各图表参考中保持一致的默认值体系600×400画布、default主题与纹理、空字符串标题因此你在其他图表参考中积累的样式经验可以直接迁移到双轴图上。3. 一条可复制的完整示例以下 payload 展示营收 vs 利润场景柱状系列与折线系列量纲不同分别通过axisYTitle声明各自的 Y 轴含义node ./scripts/generate.js { tool: generate_dual_axes_chart, args: { categories: [2022, 2023, 2024], series: [ { type: column, data: [1200, 1580, 2010], axisYTitle: 营收万元 }, { type: line, data: [86, 152, 240], axisYTitle: 利润万元 } ], title: 近三年营收与利润, theme: default, width: 600, height: 400 } }执行约定来自 SKILL.md在chart-visualization技能目录下执行node ./scripts/generate.js payload_json脚本成功后在 stdout 输出生成的图表图像 URL。技能清单的 frontmatter 要求nodejs 18.0.0脚本使用了全局fetch且需要能访问图表生成服务端见第 5 节。4. 技能工作流中的位置四步流水线chart-visualization技能在 SKILL.md 中定义了固定工作流双轴图是其中第 2 步的产物之一Intelligent Chart Selection智能选图分析数据特征确定图表类型——时间序列且量纲不同即命中generate_dual_axes_chartParameter Extraction参数提取读取references/下对应文件即本文核心文档确认必填/可选字段把用户数据映射为argsChart Generation图表生成以 JSON payload 调用scripts/generate.jspayload 结构为{tool: generate_chart_type_name, args: {...}}Result Return结果返回脚本输出图像 URL随后向用户同时返回图像 URL与完整的args规格即 spec便于复现与二次编辑。因此参考文档中返回双轴图图像 URL并随_meta.spec给出详细参数这一条对应的是技能层对 Agent 的交付约定URL 用于展示_meta.spec用于可追溯地还原生成参数。5. 源码级实现payload 如何变成图像 URL下面从 generate.js 的源码说明一次双轴图请求的底层路径。5.1 工具名到图表类型的映射脚本顶部维护了与前端src/utils/callTool.ts保持一致的CHART_TYPE_MAPgenerate.js#L6-L32其中双轴图的映射为const CHART_TYPE_MAP { // ... generate_dual_axes_chart: dual-axes, // ... };即 payload 中的tool: generate_dual_axes_chart会被归一化为服务端识别的类型字符串dual-axes。若传入未知工具名脚本会打印Unknown tool并跳过该项generate.js#L131-L135批量场景下不会中断后续图表。5.2 服务端地址与请求体服务端地址generate.js#L34-L39优先读取环境变量VIS_REQUEST_SERVER缺省回退到https://antv-studio.alipay.com/api/gpt-vis。这决定了本地运行该技能时的适用前提要么可直连默认服务端要么通过VIS_REQUEST_SERVER指向自建/代理端点。请求体组装generate.js#L62-L77generateChartUrl把图表类型与你的args合并为{ type: dual-axes, source: chart-visualization-creator, ...options }后以POST application/json发出响应中success为假时抛出errorMessage成功时返回resultObj即图像 URL并打印到 stdout。入参解析generate.js#L97-L116第一个命令行参数既可以是 JSON 字符串也可以是 JSON 文件路径脚本先尝试fs.existsSync判断并且支持传入数组批量生成多张图generate.js#L118。此外可以注意到脚本对地图类工具generate_district_map/generate_path_map/generate_pin_map走独立的generateMap分支并额外携带serviceId来自环境变量SERVICE_ID而双轴图属于普通图表分支只需第 5.2 节所述的标准 payload无需SERVICE_ID。6. 使用建议与避坑要点结合参考文档的使用建议与脚本行为实践中有四条约束值得遵守克制使用仅在确有不同量纲或图例对比需求时选用双轴图避免滥用导致误读系列数量 ≤ 2超过两个系列会让双轴语义左右轴归属变得含混阅读复杂度急剧上升量级悬殊时用次坐标轴缩放若两条曲线差值巨大应依赖次坐标轴进行缩放而不是直接叠加data长度对齐series[].data与categories长度不一致是最常见的构造错误应在 Agent 提取参数阶段校验rough纹理与academy/dark主题可安全混用于任何theme取值组合但配色建议通过style.palette显式指定以区分柱状与折线。7. 小结与延伸阅读generate_dual_axes_chart是 deer-flowchart-visualization技能中专门处理异量纲双序列的图表工具输入遵循categories series契约样式与画布参数有统一的默认值体系执行侧由 generate.js 统一完成工具名映射、HTTP 请求与 URL 输出Agent 最终向用户交付图像 URL 完整 spec。延伸阅读均以仓库根目录为起点双轴图参数规范原文skills/public/chart-visualization/references/generate_dual_axes_chart.md技能工作流与 payload 格式skills/public/chart-visualization/SKILL.md同系列参考对比数据形态差异柱状图、折线图26 种图表的完整参考目录skills/public/chart-visualization/references/【免费下载链接】deer-flowAn open-source long-horizon SuperAgent harness that researches, codes, and creates. With the help of sandboxes, memories, tools, skill, subagents and message gateway, it handles different levels of tasks that could take minutes to hours.项目地址: https://gitcode.com/GitHub_Trending/de/deer-flow创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
deer-flow chart-visualization 技能实战：双轴图（generate_dual_axes_chart）参数规范与调用链路
deer-flow chart-visualization 技能实战双轴图generate_dual_axes_chart参数规范与调用链路【免费下载链接】deer-flowAn open-source long-horizon SuperAgent harness that researches, codes, and creates. With the help of sandboxes, memories, tools, skill, subagents and message gateway, it handles different levels of tasks that could take minutes to hours.项目地址: https://gitcode.com/GitHub_Trending/de/deer-flow本文以 deer-flow 技能库chart-visualization中的双轴图参考文档为核心完整梳理generate_dual_axes_chart的输入字段、默认值与使用约束并结合技能入口 SKILL.md 与执行脚本 generate.js 的源码说明一份双轴图 spec 从 Agent 组装参数到输出图像 URL 的完整调用链。读完后你可以直接编写可运行的双轴图 payload并理解其在技能流水线中的角色与适用边界。1. 双轴图的定位趋势与对比同屏展示双轴图dual-axes的核心能力是在同一画布上叠加柱状与折线或两条不同量纲的曲线用于同时展示趋势与对比典型场景如营收 vs 利润、温度 vs 降雨。从 SKILL.md 的图表选择指南可以看到generate_dual_axes_chart被明确归入Time Series时间序列一类且只在两个序列量纲不同two different scales时才被推荐选用Time Seriesgenerate_line_chart趋势或generate_area_chart累积趋势量纲不同的两个序列则用generate_dual_axes_chart。这意味着双轴图不是普通折线图的替代而是解决两条曲线无法共用同一 Y 轴这一特定问题的图表类型。2. 输入字段规范以下内容完整继承自参考文档 generate_dual_axes_chart.md并在参数说明中补充了与技能整体约定一致的取值细节。2.1 必填字段字段类型说明categoriesstring[]按顺序提供 X 轴刻度如年份、月份、品类seriesarrayobject每项至少包含typecolumn/line与datanumber[]长度必须与categories一致可选axisYTitlestring描述该系列 Y 轴含义两点关键约束值得注意series[].data的长度必须与categories一致否则无法对齐 X 轴刻度axisYTitle是系列级字段而非顶层字段这正是双轴语义的体现——每个系列可以声明自己所属 Y 轴的含义左轴与右轴各自独立标注。与同目录其他图表参考如 generate_column_chart.md 使用扁平data: arrayobject相比双轴图采用categories series的结构化数据形态这是多系列图表如 line、dual-axes 类共用的数据约定。2.2 可选字段字段类型默认值说明style.backgroundColorstring—自定义背景色style.palettestring[]—配置多系列配色style.texturestringdefault可选default/roughthemestringdefault可选default/academy/darkwidthnumber600画布宽度heightnumber400画布高度titlestring图表标题axisXTitlestringX 轴标题可选字段在chart-visualization各图表参考中保持一致的默认值体系600×400画布、default主题与纹理、空字符串标题因此你在其他图表参考中积累的样式经验可以直接迁移到双轴图上。3. 一条可复制的完整示例以下 payload 展示营收 vs 利润场景柱状系列与折线系列量纲不同分别通过axisYTitle声明各自的 Y 轴含义node ./scripts/generate.js { tool: generate_dual_axes_chart, args: { categories: [2022, 2023, 2024], series: [ { type: column, data: [1200, 1580, 2010], axisYTitle: 营收万元 }, { type: line, data: [86, 152, 240], axisYTitle: 利润万元 } ], title: 近三年营收与利润, theme: default, width: 600, height: 400 } }执行约定来自 SKILL.md在chart-visualization技能目录下执行node ./scripts/generate.js payload_json脚本成功后在 stdout 输出生成的图表图像 URL。技能清单的 frontmatter 要求nodejs 18.0.0脚本使用了全局fetch且需要能访问图表生成服务端见第 5 节。4. 技能工作流中的位置四步流水线chart-visualization技能在 SKILL.md 中定义了固定工作流双轴图是其中第 2 步的产物之一Intelligent Chart Selection智能选图分析数据特征确定图表类型——时间序列且量纲不同即命中generate_dual_axes_chartParameter Extraction参数提取读取references/下对应文件即本文核心文档确认必填/可选字段把用户数据映射为argsChart Generation图表生成以 JSON payload 调用scripts/generate.jspayload 结构为{tool: generate_chart_type_name, args: {...}}Result Return结果返回脚本输出图像 URL随后向用户同时返回图像 URL与完整的args规格即 spec便于复现与二次编辑。因此参考文档中返回双轴图图像 URL并随_meta.spec给出详细参数这一条对应的是技能层对 Agent 的交付约定URL 用于展示_meta.spec用于可追溯地还原生成参数。5. 源码级实现payload 如何变成图像 URL下面从 generate.js 的源码说明一次双轴图请求的底层路径。5.1 工具名到图表类型的映射脚本顶部维护了与前端src/utils/callTool.ts保持一致的CHART_TYPE_MAPgenerate.js#L6-L32其中双轴图的映射为const CHART_TYPE_MAP { // ... generate_dual_axes_chart: dual-axes, // ... };即 payload 中的tool: generate_dual_axes_chart会被归一化为服务端识别的类型字符串dual-axes。若传入未知工具名脚本会打印Unknown tool并跳过该项generate.js#L131-L135批量场景下不会中断后续图表。5.2 服务端地址与请求体服务端地址generate.js#L34-L39优先读取环境变量VIS_REQUEST_SERVER缺省回退到https://antv-studio.alipay.com/api/gpt-vis。这决定了本地运行该技能时的适用前提要么可直连默认服务端要么通过VIS_REQUEST_SERVER指向自建/代理端点。请求体组装generate.js#L62-L77generateChartUrl把图表类型与你的args合并为{ type: dual-axes, source: chart-visualization-creator, ...options }后以POST application/json发出响应中success为假时抛出errorMessage成功时返回resultObj即图像 URL并打印到 stdout。入参解析generate.js#L97-L116第一个命令行参数既可以是 JSON 字符串也可以是 JSON 文件路径脚本先尝试fs.existsSync判断并且支持传入数组批量生成多张图generate.js#L118。此外可以注意到脚本对地图类工具generate_district_map/generate_path_map/generate_pin_map走独立的generateMap分支并额外携带serviceId来自环境变量SERVICE_ID而双轴图属于普通图表分支只需第 5.2 节所述的标准 payload无需SERVICE_ID。6. 使用建议与避坑要点结合参考文档的使用建议与脚本行为实践中有四条约束值得遵守克制使用仅在确有不同量纲或图例对比需求时选用双轴图避免滥用导致误读系列数量 ≤ 2超过两个系列会让双轴语义左右轴归属变得含混阅读复杂度急剧上升量级悬殊时用次坐标轴缩放若两条曲线差值巨大应依赖次坐标轴进行缩放而不是直接叠加data长度对齐series[].data与categories长度不一致是最常见的构造错误应在 Agent 提取参数阶段校验rough纹理与academy/dark主题可安全混用于任何theme取值组合但配色建议通过style.palette显式指定以区分柱状与折线。7. 小结与延伸阅读generate_dual_axes_chart是 deer-flowchart-visualization技能中专门处理异量纲双序列的图表工具输入遵循categories series契约样式与画布参数有统一的默认值体系执行侧由 generate.js 统一完成工具名映射、HTTP 请求与 URL 输出Agent 最终向用户交付图像 URL 完整 spec。延伸阅读均以仓库根目录为起点双轴图参数规范原文skills/public/chart-visualization/references/generate_dual_axes_chart.md技能工作流与 payload 格式skills/public/chart-visualization/SKILL.md同系列参考对比数据形态差异柱状图、折线图26 种图表的完整参考目录skills/public/chart-visualization/references/【免费下载链接】deer-flowAn open-source long-horizon SuperAgent harness that researches, codes, and creates. With the help of sandboxes, memories, tools, skill, subagents and message gateway, it handles different levels of tasks that could take minutes to hours.项目地址: https://gitcode.com/GitHub_Trending/de/deer-flow创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考