内置组件类型
VizChat 内置的每个组件分别用来做什么——图表、数学、数据表、文本、文档、网页、信息图与幻灯片——以及各自的完整参考在哪里。
画布上的一切内容都是组件(widget)。VizChat 内置了一组覆盖常见场景的组件;内置组件满足不了的需求,可以做成自定义组件。
每个组件自带数据字段和操作。你通常不需要直接接触这些——在对话里描述需求,Agent 会替你填好。
本页讲每个内置组件用来做什么。每一段末尾都有一个指向该组件市场详情页的链接,那里是完整参考:字段、操作,以及一个可以直接上手的实时演示。
图表与数据
柱状图(Bar Chart)
用于比较若干离散类别之间的数值——地区、产品、时间桶——关注的是排名与相对大小。数据是一组带标签的数据项,可在画布上直接编辑,可横可纵,共用一套配色方案,数值标签可开可关。每根柱子都是独立锚点,于是 storyboard 的 cue 可以在讲到某一类时指着那根柱子说话,Agent 也能在两步之间加一项、改一项或换个颜色。
折线图(Line Chart)
当问题是「某个指标怎么变的」——随时间、随实验轮次、沿任何有序坐标——就用它。这里的每一项是一整条数据系列而非单个数值,因此多条系列共用一对坐标轴,可选曲线平滑与数据点样式。柱子表示分桶、折线表示累计时,两者搭配最自然。系列与数据点都可寻址,cue 因此能带着观众沿曲线一段一段地走。
饼图(Pie Chart)
用于构成——少数几个部分如何组成整体。支持饼图与环形两种形态,配色方案、把正在讨论的那一块「炸开」的效果,以及标签与图例策略。扇区控制在五到七块以内;再多就该换柱状图了。讲解时想突出某一份占比,通常就是用 cue 把那一块炸开。
数学坐标系(Math Coordinate)
用于数学讲解的交互式坐标平面,可绘制十二类对象——点、线、圆、多边形、函数曲线、隐式曲线、轨迹、不等式区域、角、轴上区间、测量与圆锥曲线;其中线分四种语义:线段、射线、直线与向量(带箭头,可显示分量虚线)。对象之间可以相互依赖:中点、交点、由参数滑块驱动沿曲线运动的点、标注角与实时测量(距离 / 斜率 / 面积 / 角度)都会随所依赖的对象联动重算;依赖不在了的对象会降级成半透明虚线并在数据面板给出原因,而不是无声消失。圆锥曲线同样是一等对象:椭圆 / 双曲线 / 抛物线自身只带参数,焦点、准线、渐近线与顶点都是架在它之上的独立对象——讲解因此可以单独点出「右焦点」,也可以再在这个焦点上架一条过焦点的弦。微积分同样是这套机制:导函数 f′ 是一条自己的曲线,表达式由来源函数算出——改函数、或拖它引用的参数,f′ 跟着动;切线、极值点、标在 x 轴上的单调区间、两条曲线的公切线、以及「两条曲线交几次」的实时计数,也都是建立在函数之上的普通对象。一个构造有多个解时,每个解各是一个对象,于是 cue 可以单独点出「第二个极值点」或「递减的那一段」。写不成 y = f(x) 的曲线可以直接按原样写:给出 F(x, y)——x*y - 4、展开写的旋转椭圆、sin(x) + sin(y)——即画出 F(x, y) = 0 的全部分支,并以方程本身作标注;表达式里可以引用参数,于是一整族曲线就是一个可以拖着看的对象。轨迹是派生点随驱动扫过值域时走出的路径——弦的一端沿圆运动时中点的轨迹、系数滑动时抛物线顶点的轨迹——由同一套构造采样得出,它所依赖的任何对象一变就重新采样,而拖动驱动本身不额外付代价。引用了参数的函数曲线或隐式曲线还可以为该参数的一段取值留下一族半透明的替身,「a 变大时图像怎么变」于是成为一张图,而不是一根要来回拖的滑块。参数还可以自己动起来——循环、往返或单次扫过值域——点则可以留下一条渐隐的追踪轨迹,于是 cue 能让一个构造动起来,让读者看着极值点走过去。把平面切到复数模式后,坐标轴标注变为 Re / Im、点按 a + bi 标注,同一张画布即可承载复数题。两条轴各有自己的刻度单位:三角函数题里 x 轴可以按 π 的倍数打刻度、标注成 π/2、3π/2,而 y 轴仍读普通数值;需要时刻度也能写成 1/2、2/3 这样的分数,网格线始终跟着刻度走。全部能力均经操作可达,讲解因此能一步一步搭出完整解题过程。
数轴(Number Line)
画一条横轴,以及落在它上面的数值与范围。点标记单个数值,分实心(取得到)与空心(取不到);区间是一段范围,两端各有自己的开闭设置,某一端延伸到无穷时画成箭头。重叠的区间会自动分层,于是 x < 0 或 x > 2 这样的并集读起来是两笔而不是糊成一团。可见范围是配置项而非拖拽缩放的结果,刻度还可以按 π 的倍数读——标注成 π/2、3π/2,正合三角函数的需要。每个点、每段区间都可以单独寻址,cue 能在讲到某处时指向「这条半轴」,解集也可以一步一步地长出来、去掉一段、或换一套刻度。
立体几何(Math 3D)
按教材画法呈现的立体图形。七种形状覆盖中学范围——长方体、任意正多边形底面的棱柱与棱锥,以及旋转体:圆柱、圆锥、圆台与球。每条棱都画两遍,看得见的那段画实线,被形体挡住的那段画虚线,因此换任何视角图都读得通,而不需要手工标注哪条该虚;旋转体没有棱可画,外形由当前视线实时算出。坐标就是教材那一套——z 向上、xy 是水平面,高度写在第三个分量上。命名顶点、辅助线与截面画在形体之上、不会被它挡住——看不见的截面就不成其为截面;辅助线的实虚完全由你指定,落在形体内部的高线因此能按惯例画成虚线。视角绕原点旋转,既可以作为讲解的一步设定,读者也能自己拖动旋转、滚轮缩放(讲解播放中同样可以,因为转动视角并不改变内容),停在哪里就记住哪里。默认平行投影以保证平行的棱保持平行,需要实物观感时可切换成透视。每个形体、顶点、辅助线与截面都可单独寻址,且 cue 点亮的是它在屏幕上真正占据的那一块,标注框圈住的是整个棱锥而不是它的中心点。
数列(Sequence)
把一条规则变成一张图:给它通项公式(2*n - 1、3^n),或者给它递推公式加初始项(初始项 1, 1 配 a1 + a2 就是斐波那契),它就把各项逐个画出来——可以只画点,也可以给每项加一条落到零线的垂线杆。打开前 n 项和,累加序列会作为第二组点叠在同一坐标系里,讨论增长、单调性与收敛时正需要它。算不出来的项会被跳过而不是让整张图作废,发散的规则也仍然能看到画得下的那一段。画出来的每一项都是独立锚点,标出来的项还会带上环与批注,于是 storyboard 的 cue 可以直接指着「第 5 项」说话,标注框随 widget 移动跟随。
概率分布(Distribution)
问题一旦落到「概率是多少」上就用它:正态曲线把问到的那一段着色并把概率写在上面;二项分布如实画成一根根柱子;没有公式可循的时候,把结果连同各自的概率列成一张分布列。着色区间由下界与上界给出,任一端都可以取到无穷——「不小于 600」就是一段只写了下界的区间,标注的概率按真正的无穷尾算,尽管图只画到四倍标准差处。均值线与一倍、两倍、三倍标准差的标记对三种分布是同一套,于是「几乎都落在三倍标准差以内」这句话在哪种分布上看到的都是同一幅图。每段着色区间、每个被点名的取值、分布列的每一项都是独立锚点,曲线本身也是——cue 因此可以先讲整条分布,再落到某一条尾巴上。
统计图(Stat Chart)
同一批数据,三种看法。直方图把各组摊在一条连续横轴上,每个矩形从组的起点画到终点——相邻组因此紧贴、组距不等时宽度也不等,组与组之间的空档如实留白而不会被补成一根零高的柱子。柱高的含义跟着数据走而不是显示开关,纵轴据此标注:频数、频率,或频率/组距——最后这种形态下矩形的面积才是频率,各矩形面积之和为 1,正是考题里最常见的画法。箱线图按五数概括逐组画箱,离群点单独画成小圈,各组共用同一条纵轴,比较才站得住;某一组的五数不合序时只标出那一组,其余照画。茎叶图把每个读数拆成茎与叶写出来,高位在竖线左侧、末位在右侧,一个数都不四舍五入,中位数可以直接数出来。每一组、每个箱、每一行都是独立锚点,cue 可以直接指着它讲。
韦恩图(Venn)
当一批东西要按「满足两三个描述中的哪几个」来归类、而真正要讲的恰是那些同时满足多个或一个都不满足的情形时,就用它。两个圆按半径重叠,三个圆摆成正三角形;每个元素带的不是坐标而是「属于哪些集合」这份名单,于是它自己落进名单描述的那一块,名单一改就自己搬过去。着色是指认某一块的方式:给出若干集合,再说清要的是「同时在这几个圈里」还是「只在这几个圈里、别的圈都不沾」。一块着色只画一块区域,所以并集是两块、交集的补集是三块;高亮的颜色取自它所指的集合。第四个集合需要椭圆而非圆才画得出,故只画前三个并给一句说明。圆、元素与着色区都可单独寻址,讲解因此能把数字一个一个放进去,最后再把答案那一块涂上。
数据表(Table)
当数字本身比图形更重要时用它:频数表、数值表,以及任何规整的网格。每个单元格存的都是文本,用 $…$ 包住的内容会排版成公式——表头走同一条路径,所以列标题写 $f(x) = x^2$ 一样有效(要写字面美元号请用 \$)。行 / 列合计只覆盖数值列,于是一列组别名称自然不会掺进算术,也不必额外标记它是标签列;数值区恰为两列两行时,网格下方还会给出 χ² 统计量。行与列表头都可寻址,cue 可以在讲到某处时指向「这一行」,一张表也可以先长出一行、再被修正、最后逐步揭示边缘和。
概率树(Probability Tree)
一件事分几步走、后一步的概率取决于前一步怎么走(不放回地连抽两次、检测后再复检),用它把每一种走法摊开。数据是一张扁平的节点表,每个节点写清自己接在谁后面,树形由此还原;节点上的数是「已经走到这里的前提下,走这一支的概率」。每条路径末端写出这个结果的概率——沿路各边相乘;路上只要有一条边还没定,结果就如实写成问号,而不是悄悄凑一个数出来。同一个分叉点的各支概率加起来不等于 1 时只标一个警示点、不拦截,因为讲到一半的树本来就常是不完整的;指向了一个不存在的父节点,则画成虚线单独摆着而不是消失不见。每个节点都是独立锚点,cue 可以在讲到某一支时点亮它;一棵树也可以先长出第一层、再补第二层、再把题目排除掉的那一支去掉。
文本与代码
富文本(Rich Text)
用于数据周围的文字——讲稿、小结、说明、静态表格与公式。它渲染 Markdown,支持 KaTeX 数学公式与分级排版配置;画布上没有编辑界面,文字来自组件内容,只有操作能改它。用 <!-- section:ID --> 注释标出的 section 可以逐个隐藏与显示,cue 正是靠它把一篇文档一段一段带出来。
代码查看器(Code Viewer)
用来带着观众读代码。语法高亮(Shiki)覆盖常见语言,支持行号、自动换行、明暗主题与高亮行范围。重点在于用 cue 移动高亮行范围:同一段代码就能随 storyboard 推进承载一整段讲解。
文档与网页
PDF 阅读器(PDF Viewer)
把论文、报告或合同留在画布上并精确引用它。它逐页渲染 workspace 里的 PDF(按 workspace 引用指向,改名不会失效)或外部 URL;Agent 可以一步完成「翻到某页 + 框出某个区域」——某个段落、某张表、某幅图。这一框正是引用可核查的关键:「它就是这么说的」附带着已经画好的框。cue 可以同时移动页码与高亮,于是读文档的过程与讲解同步推进。
网页查看器(Web Viewer)
不离开画布就能引用网页。它从不嵌入原站——画布一律拦截外部页面,与目标站点自身允许什么无关——后端抽取页面正文,widget 渲染的是这份净化过的副本,附带抽取出的标题、favicon 和回到原页的链接。可以高亮某个短语并滚动定位;Agent 读的就是你看到的这份正文,这让「把这几页总结一下」成为可靠请求。做文献综述时把十几个参考页并排铺开,再用 cue 逐个走过。
外链卡片(Web Link)
当作书签卡片用:一个外部 URL 的标题、描述与 favicon,不抓正文、不嵌入任何内容。适合资源清单与参考条目——链接本身就是内容。想把页面正文放到画布上,请改用网页查看器。
HTML 嵌入(HTML Embed)
用于 workspace 里的 HTML 文件——生成的报告、导出的 notebook、自己写的页面。文档按 workspace 引用指向,移动或改名都不会失效;渲染在沙箱里,其中的脚本不会执行。Agent 可以滚动到并高亮某个元素,于是 cue 能把观众带到长报告的某一节。外部实时页面在这里显示不了——那是网页查看器的事。
图形
信息图(Infographic)
当排版与数据同样承载信息时用它——首屏主视觉、步骤图、对比、数值高亮。内容是一段声明式 DSL,首行点名内置模板库里的某个模板;渲染器负责排版、配色与自适应布局,主题设置(style、覆盖配色、细粒度主题配置)不动内容就能换一套样子。DSL 由 Agent 通过操作写入与追加,所以想改就在对话里说,不必去找输入框。它很适合作为 storyboard 某一步的视觉主角,配合 cue 字幕与演讲人设。
图片(Image)
把题目对应的那张图——实验装置图、几何图形、照片、界面截图——放到解题过程旁边。图片来自 workspace 文件(按引用指向,改名不会失效)或一个 URL,可带替代文本与图注。它比一个相框多出来的东西是「区域」:带名字的框,几何量按原图百分比给出,所以无论怎样缩放 widget,每个区域都指着图上同一块地方。每个区域都是独立锚点,cue 可以在你讲到某一部分时点亮它,再移到下一个。
幻灯片
封面页(Cover Slide)
用来开场、标记章节分隔,或者收尾在一页致谢上。三层文字——eyebrow、标题、副标题——叠在纯色或渐变背景上,可设对齐方式。一个入场计数器记录三层序列推进到哪一层,于是 cue 可以让封面一行一行地出现,每一步淡入并轻微位移。
自定义组件
当内置组件都不合适时——计时器、看板、计算器、某种特定的交互组件——Agent 可以现做一个,并发布到你的私有组件库。发布后的组件可以跨文档复用,也可以通过市场分享。
内置组件与用户发布的组件在同一个池子里检索,所以 Agent 会先复用已有组件,再考虑新建。