【发布时间】：2012-11-06 15:43:39
【问题描述】：
我想使用 html5 画布路径 绘制具有双线边框的形状。默认笔画 (context.stroke()) 具有单线类型的路径。我可以在原始形状内绘制一个类似的形状以生成一个看起来像由两条边界线组成的图形，但我想要某种通用解决方案。有什么想法吗？
【问题讨论】：
标签： html canvas path border stroke
【发布时间】：2012-11-06 15:43:39
【问题描述】：
有几种方法可以做到这一点。一种简单的方法是画一条粗线并“剪掉”它的中间，留下两个较小的笔划。
您想要做的是绘制任何类型的路径 - 在内存中的临时画布上 - 然后以较小的厚度绘制相同的路径，并将 globalCompositeOperation 设置为 @987654323 @ 在同一张画布上。
这会让你得到你想要的形状，基本上是两条线，它们之间是透明的。
然后您将该画布绘制到具有任何内容（复杂背景等）的真实画布上。
这是一个例子：
【讨论】：
-
好主意！我想建议绘制一次并稍微调整大小，但这会增加模糊度。您的解决方案使线条清晰。我想没有更好的办法了。