我能在Javascript中识别(图形平板)笔压吗?

8

有没有办法使用JavaScript识别笔压力?最好不要使用Flash,尽可能使用纯JS实现。

编辑:我意识到对于Wacom平板电脑来说是有可能的,因为它们配备了可以与其JavaScript API一起使用的软件(demos)。但对于使用Trust平板或其他品牌的人来说就不太好了...所以这并不好。

如果不能用JS,有人知道如何在C#中实现吗?

6个回答

15

如果用户安装了Wacom平板电脑,那么他们的浏览器将会有一个插件可以访问。 http://www.wacomeng.com/web/index.html

作者编辑:我写这篇文章时已经很久了,请参见下面的评论。


1
这是最好的答案。不幸的是,由于平板技术尚未标准化,没有完美的解决方案。只需记住,目前在Mac上使用Wacom Bamboo平板电脑(CTL-460)与Chrome一起存在一个轻微的错误(可能也存在于Windows上,但我个人没有测试过),导致isEraser变量始终显示为true,无论实际使用哪一端。此句链接到Chromium Bug报告 - Adrian
1
很遗憾,自2014年1月起,Chrome开始逐步淘汰NPAPI支持(http://www.chromium.org/developers/npapi-deprecation),因此即使您拥有插件,Chrome也不会加载它:(我刚在MacOSX Yosemite上尝试了一下,在Safari上可以工作,但在Chrome上不行。) - Diego
1
这个回答在10年前还很好,但现在它已经过时了,因为指针事件是一个新技术(请参阅其他得到投票支持的答案)。 - Krastanov
我已经添加了删除线以表明过时。自从我的原始回答以来,进展令人惊喜。 - aehlke

13

微软在IE11中实现了称为Pointer Events的东西。它允许您访问压力属性以及笔倾斜和接触几何尺寸等内容。

到目前为止,它只在IE11上运行(以及带有供应商前缀的IE10),但有一个W3C 候选推荐,因此也许将来会成为标准。


你可以使用 pressurejs 来实现它。它似乎还支持其他各种 API(iOS 和 Apple pencil)。 - Wouter
1
现在Chrome和Opera也支持此功能,并在Firefox中进行实验。 - Andreas

2

JavaScript作为一种编程语言本身并没有比其他语言更具有读取这种数据的能力或缺乏能力。

语言并不重要,重要的是语言内部可用的API。

JavaScript可以在许多不同的环境中运行,其中一些可能可以访问此类硬件的API。然而,大多数JavaScript在Web浏览器环境中运行,这显然是您的意思。

Web浏览器环境提供了许多API。最明显的是DOM,它使您能够操作页面等。浏览器中还有其他可用的API。例如,地理位置API。

所有这些都是由W3C定义的标准API(或在某些情况下正在被W3C定义),这意味着支持它们的所有浏览器应该以相同的方式使它们工作。

不幸的是,对于您来说,没有用于处理压力垫的标准API,因此直接回答您的问题是否定的。

未来是否会有这样的API仍有待观察,但我对此表示怀疑。

不过,有一种方法可以做到:ActiveX。

ActiveX是由Microsoft在早期版本的IE中提供的API。它基本上提供了一种从浏览器内部访问几乎任何Windows DLL代码的方式。

由于Windows的压感笔设备驱动程序将作为DLL提供,这意味着理论上您应该能够通过ActiveX控件在浏览器中访问它。因此,是的,您可以使用Javascript编程。

不过,坏消息是,这不是我推荐的东西。作为基于浏览器的技术,ActiveX早已被放弃,因为它造成了巨大的安全漏洞。我认为最新版本的IE甚至不支持它(无论如何,我希望不支持),这意味着您将被迫使用旧版本的IE(而且只有IE - 没有其他浏览器支持它)来运行您的代码。不理想。


0

不,这是不可能的。甚至使用Flash也不行。


0

你只能在本地应用程序中实现这一点。Javascript无法访问笔压信息。


0
有一种方法可以获得笔压感,你需要使用指针事件API。 有三个事件: - pointerup - pointerdown - pointermove
var canvas = document.getElementsById("my-canvas");
canvas.addEventListener('pointermove', pointerMoveEvent);

function pointerMoveEvent(event) {
  console.log(event.pointerType)
  
  if(event.pointerType === "pen") {
      if (event.pressure !== undefined) {
        const pressure = event.pressure;
      console.log(`Pressure: ${pressure}`);
      }
    }
  
}

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接