圖表檢視器

將互動圖表匯出為可信任的本地 HTML 後，可用 askr-chart-view 在正文中顯示，或透過按鈕開啟浮動視窗。圖表保留自己的資料提示、縮放、平移與重設控制項。請先操作數學示意範例。

嵌入圖表

將圖表與必要的 JavaScript 一起匯出為獨立 HTML，接著使用相對於 .qmd 文件的路徑：

{{< askr-chart-view src="images/chart.html" label="檢視圖表" >}}

預設為 mode="inline"。外框會隨文章寬度調整，並提供「展開」控制項。若正文只需要開啟浮動視窗的按鈕：

{{< askr-chart-view src="images/chart.html" mode="button" label="開啟圖表" >}}

src 指定本地 .html 檔案，不接受遠端網址。label 為圖表或按鈕提供名稱，方便讀者區分多個入口，預設為 View chart。mode 可設定為 inline 或 button。

Askr 檢視器腳本無法載入時，正文框架與來源連結仍會保留，只有按鈕的入口則維持為 HTML 連結。圖表互動仍需要匯出檔案內的 JavaScript。HTML 以外的輸出格式會保留來源檔案連結。

請使用 Quarto 預覽或本地靜態伺服器，以 HTTP(S) 提供渲染後的網站，才能啟用浮動檢視器。直接以 file:// 開啟頁面時，會保留原生正文框架與來源連結。系統只會自動複製 HTML；若匯出內容包含其他腳本或資料檔案，請在原生 project.resources 宣告，或改用獨立匯出檔案。

選擇內容

交付內容	元件
靜態 SVG、PNG 或 JPEG	圖片檢視器提供圖片縮放、平移與 Fit。
互動 HTML 圖表	圖表檢視器保留圖表自己的互動功能。
原生 Mermaid 圖表	Mermaid 檢視器使用圖片控制項開啟繪製後的圖。

Askr 提供 iframe 與浮動視窗外框。作者用自己選擇的繪圖工具產生 HTML，並包含該圖表需要的執行資源。展示頁的正弦曲線只在範例檔案內附上 Plotly，不會將 Plotly 或其他繪圖引擎加入 Askr extension。

信任、主題與狀態

請使用自己撰寫或已審查的 HTML。圖表會以網站同源內容執行腳本，因此應將它視為可執行的網站內容。發布前請檢查檔案與資源請求；HTML 內的外部腳本或資料請求仍由作者負責。

外框與視窗控制項會隨 Askr 亮暗模式切換。圖表本身保留作者選擇的配色與標籤；若需要另一套圖表主題，請在圖表中準備，不由 Askr 重新著色。

浮動工具列提供「開啟原始圖表」與「關閉」。

正文與浮動視窗各有獨立狀態。展開時會載入另一份圖表；關閉後，正文圖表保留原本的操作狀態。兩者不會共用縮放、選取或資料狀態。請用圖表本身的控制項探索資料，再關閉視窗或按 Escape 返回文章。