在线题库如何嵌入可交互几何画板？展示、作答与保存方案-尧图网络科技

在线题库里的几何图，大多仍是一张图片。

这对普通选择题通常够用，但一旦遇到动态构型、参数变化或几何作图题，图片的限制会立刻出现：学生不能拖动观察，老师不能在原图上修改，系统也无法保存用户真正画了哪些对象。

因此，题库嵌入几何画板的目标不应该只是“替换图片”，而是建立三种能力：

在题目和解析中展示可交互几何内容；
在作图题中让学生完成并提交构造；
在内容后台让老师创建、修改和审核图形。

这三种页面对画板的要求不同，不能全部塞进同一个配置。

一、题目页：用演示模式控制交互范围

题目页的重点是阅读和观察，而不是自由创作。推荐使用轻量的演示模式：

import{createPresentation}from'@dajiaoai/algeo-sdk';constpresentation=awaitcreatePresentation(container,{auth:{appId:'YOUR_APP_ID'},});awaitpresentation.loadFile(question.geometryContent);

题目接口可以返回文本、选项和几何内容：

{"id":"question_10086","stem":"拖动点 D，观察∠ADB 的变化规律。","geometryContent":{"slides":[],"messages":[],"metadata":{"version":"11"}}}

实际数据中的slides会保存几何对象、样式和文档内容。前端不应手工拼装底层 definitions，而应加载由编辑器、REPL 或服务端流程生成的完整文件内容。

题目有多个推导步骤时，可以用多画板组织：第一页展示条件，第二页显示辅助线，第三页展示结论。页面中的“上一步/下一步”按钮可以调用 SDK 切换画板。

二、解析页：让图形配合推理，而不是重复题目

很多题库把题目图片原样复制到解析区。交互式画板可以做得更多：

突出本步骤使用的线段；
隐藏暂时无关的辅助对象；
通过滑块展示参数变化；
用按钮触发一段构造或动画；
将不同解法放在不同画板。

演示模式提供 REPL 接口，宿主页面可以在用户展开某一步时调整画板状态：

awaitpresentation.repl('style #AD { color: #e5484d; width: 3; }');

具体样式语法应以当前 REPL 手册为准。产品设计上，最好让交互服务于当前推理步骤，而不是让学生在复杂画板里自行寻找重点。

三、作图题：使用编辑模式保存结构化答案

学生需要作图时，应切换到编辑模式，并按题目要求精简 UI：

import{createEditor}from'@dajiaoai/algeo-sdk';consteditor=awaitcreateEditor(container,{auth:{appId:'YOUR_APP_ID'},initialContent:question.initialGeometry,ui:{navbar:false,slidePanel:false,toolboxPanel:true,algebraPanel:false,docPanel:false,aiChatPanel:false,},});

提交时读取最新内容：

asyncfunctionsubmitAnswer(){constcontent=awaiteditor.document.getContent();awaitfetch(`/api/questions/${questionId}/answers`,{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({content}),});}

与截图答案相比，结构化内容能保留对象和关系，也方便后续回放、人工审核和继续编辑。

但需要特别说明：**保存结构化答案不等于已经实现自动判分。**判分仍需要定义允许工具、目标构造、等价性规则和容错策略。第一阶段可以先完成“作图—提交—教师查看”，再逐步评估自动判定。

四、教师后台：把制图放进出题流程

老师在内容后台需要的不是题目页同款播放器，而是完整编辑模式：

创建和删除画板；
复制某一步形成下一页；
撤销、重做和跳转历史；
调整工具栏及其他面板；
保存结构化内容；
导出 PNG、SVG 或 LaTeX/TikZ 用于其他渠道。

保存事件可以直接对接题库现有的草稿与审核流程：

编辑中 → 提交审核 → 审核退回 → 修改 → 已发布 ↕ 几何文件版本

不要让“发布题目”直接覆盖唯一一份几何数据。建议至少区分当前草稿版本和已发布版本，确保修改不会影响正在使用的试卷。

五、推荐的数据模型

题库可以按以下方式关联内容：

Question id stem geometryDraftId geometryPublishedId GeometryDocument id contentJson protocolVersion createdBy createdAt GeometryRevision documentId revision contentJson changeNote

SDK 的文件协议包含多画板、几何定义、变量、样式、富文本和 AI 对话历史。数据库可以全量保存 JSON，并单独记录协议版本、关联业务对象和修订信息。