在svg中操纵颜色

时间:2015-09-02 19:19:33

标签: css3 svg html5-canvas sublimetext3

我有多个内联svg文件。这些svg是多色svg文件。有没有办法将内联svg文件中的所有颜色转换为#FFFFFF? (我使用崇高3)

注意:我正在寻找一种更新内联svg内部颜色的方法。

编辑:

示例:

<svg><path fill-rule="evenodd" clip-rule="evenodd" fill="#FF6600" d="M306.5 64.2v-0.1l0.3-0.4 9.2-22.1 -106.3-2.4 ....."/><path fill-rule="evenodd" clip-rule="evenodd" fill="#BCBEC0" d="M414 83.6l0.5 ...."/><path fill-rule="evenodd" clip-rule="evenodd" fill="#E5E5E5" d="M430.5 319.2l-0.1 1.2 -7.2 3.9 ..."/><linearGradient id="SVG1" gradientUnits="userSpaceOnUse" x1="264.3843" y1="81.6587" x2="272.8713" y2="413.0609"><stop offset="0" stop-color="#171312"/><stop offset="0.4471" style="stop-color:#171312;stop-opacity:0"/><stop offset="0.8549" class="b_vg" stop-color="#171312"/></linearGradient></svg>

1 个答案:

答案 0 :(得分:1)

getElementsByTagName(“path”)将获得一组路径(假设所有颜色都已设置)。然后迭代那些调用setAttribute。

var paths = document.getElementsByTagName("path"); 
for (var i = 0; i < paths.length; i++) { 
    paths[i].setAttribute("fill", "#FFFFFF"); 
}