javascript - HTML5 canvas 绘制自定义光标

Question

我有一个 canvas你可以在哪里画画，我希望用户看到他画的点的大小。所以我需要在 Canvas 上绘制一个 10x10 像素正方形的自定义光标。 当然，我不想在用户只是移动鼠标时在图像上作画。

我如何做到这一点的想法:

1. 我可以以某种方式备份原始图像并每次都将其涂满
2. 我可以用光标移动 a。但我需要转发每次点击，并在光标离开 Canvas 时使其不可见。
3. 我可以创建一个 layered canvas在我的上面有第二个 Canvas ，仅用于绘制光标。

最好的做法是什么？

更新

对不起，我没有很好地解释自己。光标需要改变颜色并捕捉到网格，所以我真的需要自己画。我知道 css cursor:url(...) 对我不起作用。

Answer 1

对 PitaJ 和 David Starkey 打勾+1——他们是正确的。

最简单/最有效的解决方案是修改游标本身。如前所述，您甚至可以为光标创建自定义图像来更改颜色。

但是如果您绝对需要对齐网格，那么您必须使用诸如分层光标 Canvas 之类的东西。无法强制用户的光标对齐网格。 (想想会导致的恶作剧!)

1 号和 3 号都可以。我自己会选择 3 号。然而，“最佳”取决于您。