微软研究院发布 Flint-interactive,让智能体生成可交互数据可视化
Flint-interactive: A language for creating interactive data visualizations - Microsoft Research
微软研究院发布 Flint-interactive,一种构建在 Flint 之上的交互式数据可视化语言,让智能体生成支持点击、筛选、缩放、高亮和跨图表联动的图表。它通过 Flint 编译器把点击、拖拽等原始触发解析为语义事件,用户只需用高层算子描述更新行为,无需编写底层可视化代码。该语言已可通过 Flint-MCP 和 MCP Apps 在对话中使用,也提供编程 API 供开发者构建仪表盘和数据故事。
正文 · AI 翻译
概览
为 AI 生成的图表带来丰富的交互性:Flint-interactive 使智能体能够创建数据可视化,用户可以通过点击、筛选、缩放、高亮和跨图表交互直接进行探索。
让复杂交互更易构建:Flint-interactive 无需用户编写底层可视化代码,而是让用户和智能体使用高层语义事件和更新算子来定义行为。
提升可靠性并减少开发工作量:通过使用 Flint 的编译器处理交互逻辑和视觉依赖关系,该系统有助于避免自定义交互式可视化中常见的许多布局、渲染和调试难题。
连接图表、文本、表格和应用:Flint-interactive 支持交互式数据故事、仪表盘和互联体验,其中一个视图中的操作可以更新另一个视图中的图表、文档、小组件或应用状态。
AI 智能体让分析数据和生成带数据可视化的报告变得轻松。它们能帮助用户比阅读冗长文本更高效地发现规律。然而,当我们想要进行探索时,我们希望超越静态可视化:我们希望能与图表交互,以放大细节、跨图表比较数据,甚至根据图表中的选择高亮文档中的相关文本,反之亦然。这要求智能体能够创建交互式数据可视化,在传达信息的同时让读者超越作者选定的视角进行探索,最好还能达到复杂数据新闻中交互式故事的质量。这让我们不禁思考:
(作为用户)我能否直接在聊天中与图表交互,以探索数据并根据我所选的内容提出后续问题?
(作为开发者)我能否让我为客户构建的 AI 智能体生成交互式可视化,帮助他们探索和理解自己的数据?
是的,这是可能的,但存在显著的实践差距。即使拥有能力强大的前沿模型,我们仍然面临:
高生成成本。智能体很少能在一轮内生成完全令人满意的交互式可视化。反复的推理、编码和调试会消耗 token 和时间。
可靠性。交互式可视化本身就颇具挑战,富有表现力的交互式图表很容易引入糟糕的布局或损坏的交互,而我们在尝试修复这些问题时又可能引入新的问题。
这些挑战有助于解释为什么在现实应用中持续生成高质量的交互式可视化仍然困难。同时,一些可视化库中的内置交互本身表现力不足,无法创建定制的交互式图表。而这些挑战的根源在于缺乏一种既有表现力又高层的语言来指定视觉交互。
视频系列
再想一想
由 Sinead Bovell 主持的视频系列,围绕大家关于 AI 都在问的问题展开。汇集微软各领域的专家声音,我们剖析这项快速变化的技术所带来的张力与前景,探索什么在演变、什么有可能实现。
Flint-interactive(在新标签页中打开)是一种在 Flint 之上创建交互式数据可视化的语言。它让用户能够更轻松地创建仪表盘、数据故事和交互式制品。Flint-interactive 的强大之处来自 Flint 的编译器,它将用户交互转换为语义事件,捕捉用户所选内容背后的含义。然后,它使用高层算子响应这些事件来更新可视化,使复杂交互的创建和维护变得容易得多。这将解决交互逻辑与视觉逻辑之间复杂依赖关系的沉重负担转移给编译器,因此用户(或智能体)可以用高层规范轻松描述富有表现力的交互。
示例 1:我们可以让用户在一个可视化视图中进行刷选,图表通过一个简单的预设交互 linked-brush 高亮用户所选国家的所有分组。
如何使用
1. 在聊天中使用 Flint
按照 MCP 设置指南,通过 Flint-MCP 和 MCP Apps 直接在聊天或画布环境中使用 Flint Interactive。在最新版本中,告诉你的智能体要绘制什么图表以及想要哪些交互;它可以在生成 Flint 图表规范的同时生成 interaction_spec,并在你的对话中渲染交互式图表。
示例 2:在聊天环境中使用 Flint-interactive,让智能体能够借助简单的 Flint 规范更可靠地生成交互式图表。它还使用户能够选择内容并将上下文传递到后续轮次。
2. 使用 Flint 构建交互式应用
使用 Flint Interactive Canvas 在仪表盘、数据故事或其他应用中构建交互式图表。你的应用可以使用事件处理器来处理 Flint Canvas 发出的语义事件,例如筛选表格、更新另一个图表或更改应用状态。要让应用中的组件控制图表的更新方式,请向 Flint Canvas 发送更新算子。
示例 2:Flint-interactive 允许开发者定义图表与外部元素(例如表格、段落)之间的交互。在这里,用户可以点击表格来高亮图表中的点,反之亦然。
3. 创建定制交互
要创建超出 Flint 预设范围的定制交互,请使用编程 API 定义触发器和自定义处理函数,将语义事件映射到自定义的图表更新序列。例如,处理函数可以高亮被点击的国家并按名称标注它。它组合了 set-style 和 set-annotation,而无需操作渲染器特定的标记。
示例 4:智能体可以使用 Flint 的编程 API 创建定制的交互式可视化。在这个 DimpVis 示例中,用户可以沿时间路径拖动点,以可视化所有城市的温度和降水如何变化。
工作原理
Flint Canvas 是一个状态机,用于跟踪画布上的用户交互并管理视觉渲染状态。Flint 通过将编译器管理的视觉逻辑与用户以语义级别指定的交互逻辑分离,使交互规范变得简单:
视觉逻辑:编译器自动将原始触发器(例如点击、拖拽和按键)解析为标识图表元素和数据的语义事件。它还将更新算子转换为渲染后的画布变更,处理命中测试和底层视觉更新。
交互逻辑:用户通过将语义交互事件映射到图表更新算子来指定交互,例如设置样式以高亮数据、设置标注以标记某个点,或设置视口以平移或缩放。用户还可以使用这些语义事件来更新外部表格、组件或应用状态。
图 1:Flint interactive 允许智能体通过将“用户正在与什么语义事件交互”映射到“他们希望画布表面发生什么更新”来描述交互逻辑。编译器承担解析视觉更新的繁重工作并管理运行时,这使得交互编写更可靠且更具成本效益。
这种分离意味着用户无需逆向工程渲染逻辑或操作渲染器特定的标记,从而使交互更易于指定和维护。此外,由于事件生成和视觉更新是可组合的,同一模型还将 Flint 与表格、文本、其他图表和组件连接起来,以构建交互式故事和仪表盘。
图表用户:在你的聊天中设置 Flint(在新标签页中打开),并让你的智能体创建交互式图表。在交互画廊中寻找灵感。
应用构建者:使用编程 API(在新标签页中打开)构建交互式仪表盘、数据故事和关联视图。与你的编码智能体分享交互编写技能,为你的应用添加预设。
交互设计师:探索定制示例(在新标签页中打开),设计新的交互,并将其转化为可复用的预设。在 GitHub 上提出预设,并分享你的原型或实现,以帮助扩展 Flint 的交互词汇。在新标签页中打开
计算机科学博士生
高级数据可视化工程师
高级首席研究经理
技术院士兼企业副总裁