首页 > 解决方案 > 凹形和封闭形状填充的 RoughJS 问题

问题描述

我在流行的 RoughJS 库中发现了一个问题(它会生成类似手绘的原语),这对我的情况来说非常重要:当我尝试用内部的空白空间填充 SVG 路径时,它会填充路径而不考虑内部空旷的地区。

例如甜甜圈将被填充两次:外圈和内圈,而预期的结果是在外圈和内圈之间的空间中填充甜甜圈。

SVG 轮廓是

<path d="M200 1200 l-65 -8 -73 -34 -73 -35 -60 -59 -59 -60 -38 -78 -37 -78 0 -120 0 -120 23 -57 23 -57 44 -61 45 -60 47 -34 48 -35 65 -27 65 -26 86 -5 85 -6 60 18 59 17 58 30 58 31 57 62 58 62 21 45 22 45 15 60 16 61 0 50 0 51 -11 53 -11 53 -28 60 -29 60 -58 58 -58 57 -35 22 -35 21 -49 19 -49 19 -61 7 -61 7 -65 -8z m215 -192 l57 -29 34 -39 33 -39 22 -47 22 -46 1 -80 0 -80 -21 -47 -22 -47 -32 -41 -33 -41 -65 -32 -66 -32 -80 0 -80 0 -50 25 -50 24 -47 48 -46 48 -22 57 -22 58 4 75 5 75 22 43 22 43 36 40 37 40 40 21 41 21 25 8 25 8 76 -3 77 -3 57 -28z" />

在此处输入图像描述

我创建了一个测试设置来在运行时检查问题: https ://glitch.com/edit/#!/mountainous-regal-feet?path=index.html%3A4%3A66

粗略的问题

有没有人有任何解决方案或解决方法?

标签: javascriptreactjssvg

解决方案


推荐阅读