在画布中使用三星S-Pen

chi*_*ief 4 javascript html5 android canvas

我正在开发一个Web应用程序,用户应该能够在平板电脑上签署文档.我们使用Galaxy Tab 12.2,因为S-Pen具有所需的精度.我绘制的画布用于侦听要在画布上绘制的touch事件.

        canvas.addEventListener('touchstart', handleStart);
        canvas.addEventListener('touchmove' , handleMove);
Run Code Online (Sandbox Code Playgroud)

这里的问题是,如果用户用手指触摸画布,画布将在那里画线.

有没有办法区分S-Pen事件和"正常"触摸事件?

我知道在带有Internet Expoler的Surface Pro 3上,我可以处理不同于手指输入的笔输入.

chi*_*ief 5

好的,我自己找到了一个工作得很好的解决方案.SPen ontouch使用radiusXradiusY= 0 触发事件.

用手指触发的事件总是半径> 0.所以要做的就是添加

if(e.targetTouches[0].radiusX === 0)
Run Code Online (Sandbox Code Playgroud)

进入事件处理程序在我的画布上绘制.

看看这个Jsfiddle