我如何填充 SVG 形状，不是使用单一颜色、图像或渐变，而是使用阴影图案，如果可能的话对角线。
已经过去 2 个小时了，我什么也没发现(至少在 2005 年之后)。
我认为可能的破解方法是使用阴影 PNG 作为填充，但这并不理想。
最佳答案
我在互联网上也没有找到任何有关对角线孵化的内容，所以我将在这里分享我的解决方案:
<pattern id="diagonalHatch" patternUnits="userSpaceOnUse" width="4" height="4">
<path d="M-1,1 l2,-2
M0,4 l4,-4
M3,5 l2,-2"
style="stroke:black; stroke-width:1" />
</pattern>
(注意路径表达式中的小写“l”)
上面创建了一个阴影线，其对角线从左下角到右上角，间隔 4 个像素。除了对角线(M0,4 l4,-4)之外，您还必须描边图案区域的左上边缘和右下边缘，因为否则该线会因剪切而“收缩”它与正方形边缘相交的地方。
要使用此图案填充矩形，请执行以下操作:
<rect x="0" y="0" width="100%" height="100%" fill="url(#diagonalHatch)"/>
关于svg - svg 中的简单填充图案 : diagonal hatching，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13069446/