CanvasCard 使用方法CanvasCard 是一个 MarginNote 插件，用来把 AI Canvas、React 可视化、HTML/JS 小动画保存成脑图卡片，并且之后可以在 MarginNote 里重新打开交互预览。使用流程:先在 Gemini、ChatGPT 或其他地方生成一段 Canvas / React / HTML 可视化代码。全选并复制这段代码。回到 MarginNote，点击工具栏里的 CanvasCard 插件按钮。点击 Create Card。插件会把剪贴板里的代码保存成一张脑图卡片。之后选中这张卡片，再点击 CanvasCard 按钮。点击 Browser Card。插件会在 MarginNote 内打开一个浮动浏览器窗口，渲染这张卡片里的可视化内容（这一步加载不出来可能是bug 我自己目前也在边用边改哦，如果有bug可以复制代码和报错给我我会尝试修复）。浮窗可以拖动、缩放，也可以用 S / M / L 调整大小。如果想取回代码，选中卡片后点击 Copy Source，源码就会复制回剪贴板。几个按钮的作用：Create Card：从剪贴板创建可视化卡片Read Card：检查当前卡片里有没有保存源码Copy Source：复制当前卡片保存的源码Browser Card：打开当前卡片的交互预览Browser Demo：测试插件浏览器是否正常Diagnostics：复制调试日志，出问题时用来反馈简单说就是：复制代码 → Create Card 保存到脑图 → 选中卡片 → Browser Card 打开交互。注意：这个插件目前还是 Beta 版，React 预览可能需要联网加载运行环境；如果 Gemini 生成的代码用了特别复杂的第三方库，可能需要稍微改一下才能跑。附一段我录制的使用示例 视频略微有些长（3min ）可以加速 请不要在意本视频中Gemini写的代码有bug ,自己用可以调到正确状态，再制作成mn卡片