嵌入 HTML 选项

使用“文件”>“嵌入”>“HTML”生成HTML 标记，然后可以将其嵌入到 HTML 页面或博客平台等服务中，以便可以显示图表。

HTML 标记需要加载远程脚本才能在页面中呈现图表。嵌入式 HTML 支持页面、链接、折叠/展开、图层、缩放、数学排版，并包括内置灯箱以及显示为适合视网膜显示的矢量图像。

选项

  • 包括我的图表的副本：默认情况下包括您的图表的 XML 副本。
  • 图表的公共 URL：使用公共 URL 加载图表（如果可用）。
  • Link：指定如何打开链接（automatic意味着在同一窗口中打开相对链接和锚点）。
  • 边框颜色：设置带有链接的形状边框的突出显示颜色。
  • Zoom：指定查看器是否应具有具有缩放功能的工具栏和初始缩放值（默认值为 100%）。
  • 链接：以给定颜色突出显示带有链接的形状（默认为#0000ff）。
  • 适合：调整图表以填充页面或容器的可用宽度。
  • 图层：指定是否可以在查看器和灯箱中显示或隐藏各个图层。
  • 灯箱：在新选项卡中或使用内置灯箱打开图表。
  • 显示编辑按钮：在灯箱中显示“在新窗口中打开”按钮。

    如果启用“图层”或“缩放”，图表上将显示一个工具栏，其中包含这些控件。当您启用 Zoom时，容器大小将随着您放大/缩小而改变。

配置和数据存储在data-mxgraph属性中的 JSON 对象中。使用以下设置来配置查看器：

  • xml/url=data：指定图表的 XML 或 URL。URL 优先于 XML。
  • toolbar=[pages|zoom|layers|lightbox|custom]：指定要包含在工具栏上的工具（例如toolbar=layers lightbox）。自定义条目需要在 中具有匹配的密钥toolbarButtons。
  • toolbar-buttons={…}：定义工具栏按钮，格式为：{key:{title: string, image: base64-encoded, handler: function[, enabled: false]}, key…}
  • toolbar-nohide=true：确保工具栏始终显示。
  • max-height=value：设置图表的最大初始高度。
  • auto-fit=false：禁用自动缩放（如果缩放按钮不可见）。
  • auto-crop=true：如果可以切换图层，则启用自动裁剪。
  • check-visible-state=false：禁用延迟渲染。
  • lightbox=[false|open]：禁用或强制灯箱在新窗口中打开。
  • layers=[index0 index1 …]：指定以空格分隔的可见图层列表（例如layers=0 1）。
  • tooltips=false：禁用工具提示。
  • toolbar-position=[top|inline|bottom]：设置工具栏的位置（默认为top）。
  • zoom=value：设置初始缩放（默认为1）。
  • editable=false：禁用从灯箱进行编辑（默认为1）。
  • allow-zoom-in=true：强制自动调整并指定是否zoom > 1允许。
  • border=value：指定图表周围的填充量（默认为8）。
  • page=value：选择初始页面（默认为0）。
  • nav=false：禁用折叠/展开。
  • resize=[true|false]：在进行更改后强制或禁用容器调整大小。
  • center=[true|false]：指定图表是否应居中（默认为false）。
  • target=[self|blank]：在同一/新窗口中打开链接（默认在same窗口中打开相关链接和锚点）。
  • move=true：设置折叠/展开是否移动同级。
  • title=value：设置工具栏的可选标题（如果没有工具栏可见，则设置工具提示）。
  • edit=url|_blank：当您单击灯箱中的“在新窗口中打开”_blank （在其中打开图表的副本）时设置可选链接。
    默认情况下，指向锚点的链接、相对链接或指向同一域的链接会在同一窗口中打开，即使嵌入的图表位于 iframe 内也是如此。target=self除非指定，否则所有其他链接都会在新窗口中打开。

要关闭灯箱，请按或单击较暗的背景、右上角的Esc关闭图标 ( ) 或工具栏中的关闭符号。X

如果容器的 CSS 边框是透明的（默认）或非空，则当您将鼠标悬停在容器上时，容器边框将会发生变化。如果启用，将显示工具栏并添加边距。

响应式开关是使用 实现的max-width:100%。

要求

嵌入式 HTML 需要 JavaScript 支持。支持的浏览器包括：Microsoft Internet Explorer 6 及更高版本、Microsoft Edge、Safari、Chrome、Firefox、Android、iOS、Microsoft 和 Chromebook 触摸设备。