计算SVG/string中的所有十六进制颜色代码

Count all hex colour codes in SVG/string

本文关键字：十六进制 颜色 代码 SVG string 计算      更新时间：2023-09-26

我有一个SVG图像，我想获得数组中的所有颜色十六进制代码。

<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
 <g display="inline">
  <title>Layer 1</title>
  <ellipse ry="116" rx="66" id="svg_1" cy="130.7" cx="375.2" stroke-width="3" stroke="#000000" fill="#FF0000"/>
  <ellipse ry="104" rx="68" id="svg_2" cy="133.7" cx="248.2" stroke-width="3" stroke="#000000" fill="#FF0000"/>
  <ellipse ry="73" rx="47" id="svg_3" cy="161.7" cx="231.2" stroke-width="3" stroke="#000000" fill="#FF0000"/>
  <rect id="svg_4" height="77" width="83" y="66.7" x="225.2" stroke-width="3" stroke="#000000" fill="#0000ff"/>
 </g>
</svg>

所以在这种情况下，我有三种不同的颜色。然而，由于复发，我总共有8个。

我可以数数。

 function count_colours(data){
    return data.match(/#/g).length;
}

很明显，我得到了8加上任何其他出现的#。

我的问题是，我能想到的任何事情都太沉重了。如果有的话，我需要一个简单的解决方案。有没有一种简单的方法可以实现这一点？在一个数组中获得所有的十六进制代码而不重复将是惊人的。

编辑：好的，所以遍历数组并使用..检查十六进制代码是否有效。。

 var isOk  = /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test('#XXXXX')

然后使用删除重复项

_.uniq(hex_codes);

但我该如何构建初始数组，这是我正在努力解决的问题。我会在初始迭代中使用indexOf（）吗。这一切看起来很混乱。

这个怎么样？

function count_colours(data) {
   var n = 0, matches, cols = {};
   if (matches = data.match(/'#[0-9A-Fa-f]{3}([0-9A-Fa-f]{3})?/g)) {
      for (var i=0; i<matches.length; i++) {
          if (!cols[matches[i]]) {
             cols[matches[i]] = 1
             n++;
          }
      }
   }
   return n;
}

在这里演示

您可能还需要考虑"#00F"、"#00F"answers"#0000FF"都是相同的颜色，但将分别计算。我在这里假设这些文件是由一个编辑器或类似的东西产生的，它在列出颜色的方式上是一致的。

是的，这取决于您的限制。

我会选择下划线实用函数uniq，因为它不值得编写自己的实现。

http://underscorejs.org/#uniq

关于你的问题，这里还有另一个答案：使用Undercore for Javascript 删除重复对象

相关文章：