我们尝试将一些 HTML 元素包含到 LaTeX 文档中。我们有一个项目，其中生成了一些复杂的 HTML 元素，如下图所示。
黄色矩形使用 JavaScript 叠加在 svg 图像上。现在我们想将这些图像包含到 LaTeX 文档中。由于有数千张这样的图像，因此无法手动生成/导出它们。
我试图找到一个可以向 LaTeX 添加 HTML 代码的解决方案，但却无所获。
上面图片的 HTML 代码可能类似于此：
<div class="topo-row mode-area-parent">
<span class="offset"><a id="t1441499130"></a></span>
<div class="sticky-holder" data-sticky-max-el="">
<div class="sticky-header">
<div class="phototopo" data-auto-zoom="true" data-tid="1441499130" data-width="650" data-height="279" data-view-scale="1.18181818181818" style="max-width: 650px" data-topodata="<!-- some json data -->">
<div class="canvas autozoom animate" style="padding-bottom: 42.9231%; transform-origin: 80.0985% 12.6168% 0px; z-index: auto; transform: scale(1);">
<img class="fixedheightmedium" src="<!-- image path -->">
<svg class="topooverlay" width="100%" height="100%" viewBox="0 0 650 279" style="display: block;">
<g class="areas">
<g class="normal">
<rect class="bg " x="480.5" y="68.5" width="82" height="14"></rect>
<path class="areashadow " d="M481.5 166.5L481.5 81.5L561.5 81.5L561.5 166.5Z"></path>
<rect class="bg " x="359.5" y="68.5" width="95" height="14"></rect>
<path class="areashadow " d="M360.5 166.5L360.5 81.5L453.5 81.5L453.5 166.5Z"></path>
<rect class="bg " x="253.5" y="68.5" width="104" height="14"></rect>
<path class="areashadow " d="M254.5 166.5L254.5 81.5L356.5 81.5L356.5 166.5Z"></path>
<rect class="bg " x="126.5" y="68.5" width="119" height="14"></rect>
<path class="areashadow " d="M127.5 166.5L127.5 81.5L244.5 81.5L244.5 166.5Z"></path>
<rect class="fg " x="127" y="69" width="118" height="13"></rect>
<rect class="fg " x="254" y="69" width="103" height="13"></rect>
<rect class="fg " x="360" y="69" width="94" height="13"></rect>
<rect class="fg " x="481" y="69" width="81" height="13"></rect>
</g>
<g class="normal">
<path class="area " d="M127.5 166.5L127.5 81.5L244.5 81.5L244.5 166.5Z"></path>
<text class=" " x="156.796875" y="79.734375">Central Park</text>
<path class="area " d="M254.5 166.5L254.5 81.5L356.5 81.5L356.5 166.5Z"></path>
<text class=" " x="289.4609375" y="79.734375">Obras Selectas</text>
<path class="area " d="M360.5 166.5L360.5 81.5L453.5 81.5L453.5 166.5Z"></path>
<text class=" " x="400.921875" y="79.796875">Sombra Perpetua</text>
<path class="area " d="M481.5 166.5L481.5 81.5L561.5 81.5L561.5 166.5Z"></path>
<text class=" " x="505.3203125" y="79.796875">El paraíso</text>
</g>
<g class="selected"></g>
<g class="selected"></g>
<g class="hover"></g>
<g class="hover"></g>
</g>
<g class="render">
<g class="routes"></g>
<g class="zindex4"></g>
<g class="labels"></g>
<defs>
<pattern id="diagonalHatch" patternUnits="userSpaceOnUse" x="0" y="0" width="10" height="10">
<line x1="-5" y1="0" x2="10" y2="15" stroke="#08c" stroke-width="3" stroke-opacity="70%"></line>
<line x1="0" y1="-5" x2="15" y2="10" stroke="#08c" stroke-width="3" stroke-opacity="70%"></line>
</pattern>
</defs>
</g>
<g class="events">
<path class="area shape" d="M127.5 166.5L127.5 81.5L244.5 81.5L244.5 166.5Z" data-nid="587217471"></path>
<rect class="area label" x="126.5" y="67.5" width="119" height="15" data-nid="587217471"></rect>
<path class="area shape" d="M254.5 166.5L254.5 81.5L356.5 81.5L356.5 166.5Z" data-nid="587225973"></path>
<rect class="area label" x="253.5" y="67.5" width="104" height="15" data-nid="587225973"></rect>
<path class="area shape" d="M360.5 166.5L360.5 81.5L453.5 81.5L453.5 166.5Z" data-nid="587233428"></path>
<rect class="area label" x="359.5" y="67.5" width="95" height="15" data-nid="587233428"></rect>
<path class="area shape" d="M481.5 166.5L481.5 81.5L561.5 81.5L561.5 166.5Z" data-nid="843824724"></path>
<rect class="area label" x="480.5" y="67.5" width="82" height="15" data-nid="843824724"></rect>
</g>
</svg>
</div><!-- .canvas -->
</div><!-- .phototopo -->
</div>
</div>
这些图像的代码不是我们编写的，所以我不知道具体是如何工作的。我们只需要将这些图像添加到包含黄色矩形的 LaTeX 文档中。
提前感谢任何帮助或建议！