我在做a的工作，我在画布上画一些线。过程很容易。但是现在我想在相同的坐标上画两条不同宽度的线，但是一条在实际线坐标的右边，一条在左边。为了更清楚，让我们看看这个例子 https://jsfiddle.net/am2222/2Oqhlfd9/

正如您所看到的，当我们画一条宽度为let的线时，它将扩展线周围的像素。我想要这样的东西：

如您所见，第二个示例仅在一侧扩展了行宽。我知道我可以通过在一边抵消线来得到这一点，但我不确定如何计算将在画布上工作。 PS： 我想在结尾得到这样的东西。两条不同风格的线，坐标相同

顺晟科技：

这只是一个在画布上移动和画线的问题。这里我画了三条线，其中两条用渐变，一条用黑色。

行的另一种选择是canvasrenderingcontext2d.fillrect()，其中定义x、y、width和height。这样就更容易计算行应该在哪里。

在本例中，我采用了另一种方法。我创建一个SVG图像，将它加载到一个image对象中，然后在画布上绘制它。SVG可能不正常地隐藏/在js中只能隐藏一个字符串。

我不知道它的性能如何，所以可能在您的上下文中不起作用--我只是发现它是解决问题的一种有趣的方法。

这也是我自己的方法