作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我需要转换图像以进行对象检测。我从具有多个多边形的 svg 图像开始。示例:
<svg ...>
<rect width = "100%" height = "100%" fill = "rgb(0,0,0)" />
<polygon points="..." fill="rgb(221,221,221)" fill-opacity="1.0" />
<polygon points="..." fill="rgb(100,100,100)" fill-opacity="0.5" />
</svg>
结果是黑色背景,对象 A 的颜色为 rgb(221,221,221),对象 B 的颜色为 rgb(50,50,50),两个对象在任何地方重叠 rgb(160,160,160)。检测算法(无法修改)通过像素值确定对象。
我已经使用 inkscape、svgr-convert 或 ImageMagikk 成功地将 svg 转换为 png。然而,这些 png 图像的边缘总是模糊的,这会干扰我的对象检测。
有什么方法可以转换成清晰的边缘吗? This image shows the conversion adding blurred pixels with incorrect values. I have zoomed into an edge to make it obvious.
编辑:完整图像示例
<svg viewBox="17.874 6.66874 74.0131 70.817" xmlns="http://www.w3.org/2000/svg">
<rect width = "100%" height = "100%" fill="black" fill-opacity="1.000000" stroke="black" stroke-opacity="1.000000" stroke-width ="0.000000"/>
<polygon points="66.499391,34.862972 35.730400,51.495089 68.667463,64.499553 " fill="rgb(221,221,221)" fill-opacity="1.000000" />
<polygon points="47.613765,49.254424 23.219703,52.458598 47.246912,50.965952 48.078815,51.599703 49.620943,52.471096 62.516253,65.471290 65.077318,43.877861 51.086443,12.014429 34.861708,20.532821 " fill="rgb(100,100,100)" fill-opacity="0.500000" />
</svg>
最佳答案
在 <svg>
中添加属性元素(它被所有子元素继承)
shape-rendering="crispEdges"
虽然从我的简短测试来看,Inkscape 似乎不支持这一点,但 rsvg-convert 支持。对于您的 Imagemagick 设置,您应该确保它委托(delegate)给 librsvg,而不是 Inkscape。
关于svg - 将 SVG 转换为具有锐边的 PNG,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54030521/
我是一名优秀的程序员,十分优秀!