iframe src必须是可访问的HTTP(S)地址，本地需起服务（如python3 -m http.server 8000）并用http://localhost:8000/chart.html；生产用绝对路径；宽高须显式设置或CSS控制；跨域通信仅支持postMessage；图表需监听iframe尺寸变化并确保加载完成后再交互。
iframe src 必须是可访问的 HTTP(S) 地址
直接写 src="chart.html" 很容易失败——如果当前页面通过 file:// 打开，浏览器会拒绝加载本地 HTML 文件，控制台报 net::ERR_FILE_NOT_FOUND 或跨域错误。这不是图表问题，是协议限制。
- 本地开发时，必须起服务：比如用
python3 -m http.server 8000，然后 iframe 的src改成"http://localhost:8000/chart.html" - 生产环境优先用绝对路径：
src="/assets/charts/dashboard.html"，避免因父页面 URL 变化导致 404 - 动态赋值前加校验：
if (url && (url.startsWith('http') || url.startsWith('/'))) iframe.src = url;
宽高不设就看不见，100% 也不等于“填满”
iframe 默认尺寸是 300×150 像素，且是内联元素。即使写了 width="100%" height="100%"，若父容器没设高度（比如 height: auto），它实际高度为 0 —— 页面上只有一条细线或完全空白。
- 显式设最小高度：
style="width: 100%; height: 600px; border: none;" - 响应式场景下，用 CSS 控制比例更可靠：
style="width: 100%; aspect-ratio: 16/9; height: auto;" - 父容器如果是
flex或grid，必须给 iframe 加flex: 1或grid-area，否则它不会撑开
跨域图表无法调用子页面 JS，postMessage 是唯一通路
如果你嵌的是不同源的图表页（比如 https://charts.example.com/embed.html），JavaScript 无法读取 iframe.contentDocument，任何 myChart.resize() 或 setOption() 都会抛 DOMException: Blocked a frame from accessing a cross-origin frame。
把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。
- 同域调试时，确认协议、域名、端口完全一致（
http和https不互通） - 跨域通信只能靠
postMessage：子页面监听window.addEventListener('message', ...)，父页用iframe.contentWindow.postMessage(..., 'https://charts.example.com') -
event.origin必须校验，不能写死event.source，否则有 XSS 风险
ECharts / Plotly 图表在 iframe 里不自动 resize
原页面监听 window.resize 没用——iframe 内部的 window 和父页面不是同一个对象。父页面尺寸变了，子页面图表不会跟着缩放，容易拉伸或留白。
立即学习“前端免费学习笔记（深入）”；
- 子页面需监听
iframe自身尺寸变化：用ResizeObserver监控 iframe 元素大小，再触发myChart.resize() - 简单方案：父页面改完 iframe 尺寸后，手动发消息触发子页面重绘：
iframe.contentWindow.postMessage({type: 'resize'}, '*') - Plotly 导出的独立 HTML 文件自带 resize 逻辑，但前提是它被完整加载；若 iframe 还没 load 完就调 resize，会静默失败
iframe.onload 触发时，子页面的 ECharts 实例可能还没初始化完毕，此时发 resize 消息等于白发。需要子页面主动通知父页“已就绪”，才能安全交互。 
