algorithm - 实时绘制 1 像素粗的锯齿线

Question

简要背景:我正在开发一个基于网络的绘图应用程序，我正在实现的工具之一是一支 1 像素粗的铅笔。该工具允许用户在 Canvas 上绘制 1px 的锯齿线。

为了确定用户在 Canvas 上绘制的位置，将监视鼠标坐标。如果按住 mouse1，光标所在的像素将发生变化。本质上，它就像 Photoshop 中的铅笔工具一样工作。

注意:Bresenham 算法不适用于这种情况。我的输入是实时提交的，所以我没有画一条从 P0 到 P1 的线，因为 P0 和 P1 之间的距离是很多像素。一般来说，P1 是 P0 的邻居。

我遇到的问题是我生成的线条没有完全干净的 1px 粗细。这是一个例子:

请注意，两条线都是手绘的，因此存在一些差异。有趣的是，Photoshop 能够为我绘制的线条制作更清晰的 1px 表示。我的线看起来更脏的原因是因为:

在我的应用程序中使用该工具绘制时，红色像素被填充。在 Photoshop 中，红色像素未被填充。这是有道理的，因为为了从给定像素移动到它的东南方向邻居，东部或南部的邻居可能会被忽略。光标恰好越过角落进入东南邻居，避免绘制红色像素的可能性极小，但这通常不会发生。

所以，剩下的问题是 Photoshop 如何能够跳过出现在我的线条中的红色像素。我唯一能想到的就是等到两个像素排队后再绘制它们中的任何一个，这样我就知道是否传递了“角落邻居”。在那种情况下，我不会绘制两个像素中的第一个，因为它相当于我图表中的红色像素。如果用户绘制一个像素，将光标向南移动一个像素，然后向东移动一个像素，则存在无法绘制预期像素的风险。应该绘制两个像素，但算法会另有说明。

有什么想法吗？ Photoshop 会如何处理这个问题？

Answer 1

两条线之间的区别基本上是 Photoshop 在绘制像素 n 之后重新考虑绘制的 n-1 像素，如果它给出正值则使用以下蒙版之一将其删除:

 x 1 x       x 1 x
 1 o x   or  x o 1
 x x x       x x x

或

 x x x       x x x
 1 o x   or  x o 1
 x 1 x       x 1 x

x=不介意
o=第n-1个像素
1=绘制像素n后标记的像素

或者写成逻辑:

假设像素 n-1 在 a[i,j] 处，所以，在标记像素 n 之后，检查:

If ( (a[i-1,j  ]==1 && a[i  ,j-1]==1) ||
     (a[i-1,j  ]==1 && a[i  ,j+1]==1) ||
     (a[i  ,j-1]==1 && a[i+1,j  ]==1) ||
     (a[i  ,j+1]==1 && a[i+1,j  ]==1))
Then
     Unmark a[i,j];

你可能希望你的画线延迟一个像素只是为了不显示你的“消失”像素(尽管我怀疑它在那个比例下会很明显)。

.