0

Inductive Automation 最新版本的 Ignition SCADA 允许程序员创建 SVG“图标库”以用于他们的 SCADA 系统。图标库被定义为一个包含嵌套 SVG 的 SVG 文件（例如 icons.svg）。以下示例显示了嵌套的“blue-circle”和“red-circle”。一个自定义图标库可以有数百个这样的嵌套 SVG：

    <?xml version="1.0" encoding="utf-8"?>
     
    <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">   
        <!--Red Circle-->
        <svg viewBox="0 0 24 24" id="red-circle">
            <circle cx="12" cy="12" r="6" stroke="black" stroke-width="1" fill="red" /> 
        </svg>
         
        <!--Blue Circle-->
        <svg viewBox="0 0 24 24" id="blue-circle">
            <circle cx="12" cy="12" r="6" stroke="black" stroke-width="1" fill="blue" /> 
        </svg>
    </svg>

在这种格式下，SCADA 工程师很难在不将它们一一拉出的情况下查看图标库中所有可用图标的外观。有没有一种简单的方法可以将此图标库中的所有图标及其 ID 加载到网页上以便于查看？我想这可以通过一些循环显示图标库中的 SVG 的 HTML 和 Javascript 来完成。我对 HTML 有一些经验，但对 Javascript 没有经验，因此其他涉及使用 Javascript 循环遍历 SVG 元素的 Stack Overflow 示例有点难以理解。

4

0 回答 0