Question

使用PHP，我需要读取id为...的csv文件...

0123,0456,0789

...然后加载SVG XML图形文件并更改这些特定ID的颜色属性。

SVG文件中的每个多边形都有如下记录。我需要更改从＃d0d0d0到＃FF0000的每个匹配记录中的fill：值。外部循环当然是id，内部将是SVG文件的每个记录。

风格=“字体大小：12px的;的补：＃d0d0d0 ;填充规则：非零;行程：＃000000;中风不透明度：1;笔划宽度：0.1;卒中miterLimit分别：4;卒中dasharray：无;卒中的linecap：对接;标记开始：无;卒中linejoin：斜面” d =“M 131.85275,310.64335 L 131.85275,311.08435” 的 ID = “0123”

对于我的业余爱好者级别的编程技巧，需要循环的一般PHP结构以及如何访问样式的特定属性的技巧将非常有用！

谢谢！布莱恩

Answer 1

DOMDocument对象有getelementbyid，getAttribute和setAttribute，可以让你更改xml。

This example看起来与您想要的相似，一旦您获得了样式explode并带有';'获取样式数组，然后使用新样式join。

Answer 2

我建议采用不同的方法：使用CSS更改颜色。不需要在那里循环使用SVG元素。为了能够做到这一点，你应该稍微清理SVG文件，这也会使它更紧凑。

根据我的理解，所有待着色的元素都具有相同的样式属性和内容

font-size:12px;fill:#d0d0d0;fill-rule:nonzero;stroke:#000000;stroke-opacity:1;stroke-width:0.1;stroke-miterlimit:4;stroke-dasharray:none;stroke-linecap:butt;marker-start:none;stroke-linejoin:bevel

删除这些属性，将其替换为合理的class属性。假设这些路径是地图上的国家/地区，然后让它们为其提供属性class="country"。然后使用一个CSS规则设置所有这些样式，例如：

.country {
  fill:  #d0d0d0;
  fill-rule:nonzero;
  stroke:#000000;
  stroke-opacity:1;
  stroke-width:0.1;
  stroke-miterlimit:4;
  stroke-dasharray:none;
  stroke-linecap:butt;
  marker-start:none;
  stroke-linejoin:bevel;
}

我遗漏了font-size属性，因为这与<path>元素无关。（可能您可以进一步简化此操作，因为很多属性会重复默认值，除非您在路径的父元素中更改这些属性，fill-rule，stroke-opacity，stroke-miterlimit，{ {1}}，stroke-dasharray和stroke-linecap是多余的，但不要伤害任何人。）

还有一个问题：如果文件中的ID看起来确实像marker-start，0123或0456，则这些ID无效，因为它们需要遵循XML名称的规则，不能以数字开头。在尝试使用其ID设置这些元素或尝试对其使用0789时，您应该会遇到问题。因此，您可能希望将其更改为getElementById()，id0123和id0456

现在，您可以从CSV数据中动态添加一些CSS。

id0789

会变成

0123,0456,0789

你已经完成了。可以将CSS添加到SVG文件的#id0123,#id0456,#id0789 {fill:#FF0000}元素中，也可以创建单独的CSS文件并从SVG引用它。这样，在动态更改颜色时，您无需对SVG进行任何更改。如果您在HTML中使用内联的SVG数据，您还可以将其添加到HTML页面中的<style>元素或HTML引用的CSS文件中。

使用PHP循环访问SVG属性

2 个答案: