doxygen-使用draw.io从SVG链接到doxygen-ref

问题描述 投票:0回答:1

我正在尝试创建一个具有可点击元素的 svg 图像,它将引导您到该元素的文档,就像在 doxygen 本身中创建的类图一样。

我们还在 VSCode 中使用 draw.io 作为插件,但这也应该在没有 VSCode 的情况下工作。

在这种特殊情况下,它是关于创建一个具有可单击组件的架构图,这将打开该组件的文档。

Draw.io 允许将图片保存为 svg,还允许在内部添加链接。它具有特殊的格式,同时还将绘图信息存储在 svg 中。

现在我有两个问题:

  1. 我添加了一个有效的链接,但在 Firefox 和 Edge 中我都无法单击该图片。
  2. doxygen 参考创建是如何工作的?由于自动链接会自动链接到提到的类,是否有类似名称的查找映射之类的东西? 原因是,我不想为 doxygen 生成之后出现的类插入真正的 html 链接,因为这不仅不舒服而且容易出错。那么我可以引用页面/部分/等吗?通过使用诸如 Markdown 链接之类的东西?我想这不太可能,因为链接位于图片内部,并且 doxygen 不会接触已经创建的 svgs,对吗?

举个例子。创建drawio文件并将其存储为svg后的SVG文件内容(修改了链接):

<svg host="65bd71144e" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="121px" height="61px" viewBox="-0.5 -0.5 121 61" content="&lt;mxfile&gt;&lt;diagram id=&quot;oiqSWY96R6bIFQIC5yqU&quot; name=&quot;Page-1&quot;&gt;dZPLboMwEEW/hmUisPtIlw0J7abqIoq6jAwM2K3ByJhC+vW1Y5uHkkgIxsd3/LgzBDiuhjdJGvohcuABCvMhwLsAocenjX4bcLbgGb9YUEqWWxRN4MD+wMHQ0Y7l0C6ESgiuWLOEmahryNSCESlFv5QVgi93bUgJV+CQEX5Nv1iuqKWbx3Di78BK6neOQjdTES92oKUkF/0M4X2AYymEslE1xMCNd94Xm5fcmR0PJqFWNxKOLcjP9Nt4gkJOUl2Wi2gb720mZ/WPRQUzt301qbOnb/maC+0EFa1eIzmmXa26FULr8EEPqajAfIDxQn9JhR6wGgN9uqQSecd17VCyJZx3hZGlNlo1nKhCyMqgjumaoGQnhnMJ9W0RVZW+fOLJKT1lJ1hbimauoNHY0bBWnX0xpejqHIw0DPC2p0zBoSGZme1192p2WRHvIh3ahX9BKhjuWh7N9nsDbYmSZy1xCQi72rvmx75t+qmVIt8fdNZGT44R173luPRUYOOwvaMfzkru0dReF/nsH8X7fw==&lt;/diagram&gt;&lt;/mxfile&gt;">
    <defs/>
    <g>
        <a xlink:href="https://stackoverflow.com">
            <rect x="0" y="0" width="120" height="60" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/>
            <g transform="translate(-0.5 -0.5)">
                <switch>
                    <foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;">
                        <div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 30px; margin-left: 1px;">
                            <div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center;">
                                <div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">
                                    BCE
                                </div>
                            </div>
                        </div>
                    </foreignObject>
                    <text x="60" y="34" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">
                        BCE
                    </text>
                </switch>
            </g>
        </a>
    </g>
    <switch>
        <g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/>
        <a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank">
            <text text-anchor="middle" font-size="10px" x="50%" y="100%">
                Text is not SVG - cannot display
            </text>
        </a>
    </switch>
</svg>

我不是 svg 专业人士,但据我了解,“a xlink”在这里正确使用,如下所示:https://www.w3.org/wiki/SVG_Links

当我在 doxygen 中引用它时

\image html testpic.drawio.svg

它显示在文档中,但不可点击。该图像是由 doxygen 使用对象标签而不是 img 标签嵌入的,所以这似乎也很好。但我注意到,打开后,有一个“#document”: generated doxagen html 这会导致问题吗?我不确定这意味着什么或如何防止它。

所以我的两个问题是:

  1. 如何实现点击图片并跳转到上述链接?
  2. 如何通过最好地使用 Doxygen 的自动链接功能以舒适的方式创建链接,以便我可以跳转到任何 doxygen 参考?

PS:为什么我想要这个? 我们目前正在使用多种工具来编写文档,这使得向其中添加一些内容变得非常烦人,并且一些工作是在一个工具中完成的,这还需要在另一个工具中完成,这需要再次更新另一个工具中的文档等等。此外,嵌入任何其他工具的图表甚至不会提供任何“可点击”功能。我们需要一个易于维护、易于开发人员创建和使用的文档。

我正在使用 doxygen 1.10.0

svg doxygen draw.io
1个回答
0
投票

老问题,但我面临着完全相同的问题。当我直接在浏览器中打开 SVG 时,SVG 中嵌入的链接工作得很好。当我将 SVG 图像包含在 doxygen 文档中时,链接不再起作用。我查看了生成的代码并确定了问题的原因。 Doxygen 为图像创建以下 HTML 代码:

<object type="image/svg+xml" data="../doxygen/LinkTest.svg" style="pointer-events: none;">drawio link test</object>

当我手动删除样式属性时,所有内容(包括超链接)都会按预期工作:

<object type="image/svg+xml" data="../doxygen/LinkTest.svg">drawio link test</object>

有人知道如何告诉 doxygen 不要生成那个愚蠢的样式属性吗?

© www.soinside.com 2019 - 2024. All rights reserved.