Agent 一接 Canvas 图表页就开始读错数据:从 Bitmap OCR 到 Semantic Overlay 的工程实战
很多团队把浏览器Agent接进运营大屏后第一批事故并不是按钮点不到而是图表读错了。⚠️ 页面上明明显示“退款率上升”执行器却把另一条系列当成目标随后导出错误结论、点击错误筛选整条分析链路都被带偏。人类读图时会同时参考图例、坐标轴、悬浮提示和当前筛选条件。 可一旦图表是Canvas渲染浏览器里常只剩一块位图Agent看到的是像素和少量外围文本真正关键的系列归属、点位坐标和时间窗口并没有进入可推理上下文。图 1Canvas 图表最难的不是截图清不清而是语义是否还在Canvas 图表页为什么会让 Agent 读错数据第一层根因是位图把结构压扁了。 柱状图里的高度、折线图里的拐点、图例里的颜色映射在人眼里是一套关系在OCR结果里却只是零散文本。只要页面同时出现两个相近数值执行器就可能把“华东区转化率”误认成“全站转化率”。第二层根因是图表语义会随着交互瞬时变化。 悬浮提示、缩放窗口、数据刷选和图例开关会持续改变当前可见事实如果动作仍按固定像素偏移推进页面一次重绘就足以让原来的点击点落到另一根柱子或另一条曲线上。⏱️[外链图片转存中…(img-VJ3iDfSe-1777785301094)]图 2OCR 能认出字不代表它知道字属于哪条系列一组回放实验把误读链路拆开这次回放了48条真实看板任务覆盖趋势判读、异常点点击、图例筛选和时间窗切换。 基线方案只用截图OCR方案二叠加外围DOM文本方案三让前端导出Semantic Overlay把系列名、点位包围盒和当前过滤条件一起交给执行器。方案任务成功率读值误判率错点图例率人工接管率截图 OCR52%19%14%23%OCR DOM 文本67%11%9%15%语义覆盖层 热区映射91%2%3%5%结果很直接问题并不在模型“不会读图”而在执行层没有把图表语义结构化。✅ 只靠截图时系统常能读出一个正确数字却答错它属于哪条线、哪个时间点、哪组过滤条件一旦补上覆盖层歧义就会明显下降。️defresolve_canvas_target(overlay,series_name,x_label):forpointinoverlay[points]:ifpoint[series]series_nameandpoint[x_label]x_label:return{bbox:point[bbox],value:point[y_value],overlay_version:overlay[version],}raiseValueError(target point not found)[外链图片转存中…(img-j6jdiZYC-1777785301098)]图 3真正要绑定的不是像素而是系列、坐标和过滤条件工程上真正要补的是 Semantic Overlay更稳的做法是让图表组件额外暴露一份轻量语义层。️ 里面至少包含chart_id、系列名、颜色、x_label、y_value、点位bbox、当前筛选条件和覆盖层版本号。执行器先在语义层完成定位与判断只有最终提交点击时才回到Canvas坐标层执行动作。另一项常被忽略的是读图和点图必须共用同一版本快照。 如果覆盖层版本已经变化、悬浮提示与缓存值不一致或图例开关刚刚触发重绘系统就该退回观察阶段而不是继续沿用旧坐标。这样做会稍慢一点却能显著减少“读对了值、点错了图”的伪成功。⭐图 4图表 Agent 要维护的是一条从语义到坐标的证据链未来 3 到 6 个月 图表 Agent 会更依赖语义热区一句话总结Canvas图表不会直接让Agent失明它真正拿走的是“这个数值属于谁”的证明。 把Bitmap OCR、Semantic Overlay和版本校验连起来后浏览器Agent才能稳定完成读图、判图和点图闭环。你们现在的图表自动化已经把系列身份和点击热区绑定成同一份证据了吗