Can I recognise (graphic tablet) Pen Pressure in Javascript?
Asked Answered
C

6

9

Is there any way to recognise pen pressure using javascript. Preferably I don't want to make any use of Flash and try get this done as pure JS.

EDIT: okay I realised that it is kind of possible for Wacom tablets as they come with software that can work with their javascript api to make it possible (demos). But it's no good for people with Trust tablets or any other brand... So no good really.

Any body know how to do it in C# if not JS?

Contiguous answered 8/5, 2012 at 22:14 Comment(0)
L
15

Yes - if the user has a Wacom tablet installed, then their browser will have a plugin for it that you can access. http://www.wacomeng.com/web/index.html

edit from author: I wrote this a very long time ago. Please see the comments below

Lectern answered 11/6, 2012 at 19:43 Comment(4)
This is the best answer. Unfortunately there is no perfect solution, as tablet technologies are far from standardized. Just keep in mind there is currently a slight bug using it with the Wacom Bamboo tablet (CTL-460) in Chrome on Mac (might be on Windows too, but not tested personally) which causes the isEraser variable to display as true no matter what end is actually in-use. This sentence links to the Chromium Bug ReportKnudsen
Sadly since Jaunary 2014 Chrome started to phase out NPAPI support (chromium.org/developers/npapi-deprecation), so even if you have the plugin it wont't be loaded by Chrome :( (just tried it on MacOSX Yosemite, it works on Safari but not in Chrome)Virology
This answer used to be great 10 years ago, but today it is misleading, as pointer events are a thing (see other upvoted answer).Zymo
i've added a strikethrough for deprecation clarity. the progress since my original answer is amazing to seeLectern
C
14

Microsoft implemented something called Pointer Events in IE 11. It allows you to access pressure property along with stuff like pen tilt and size of contact geometry.

So far it only works on IE11 (and IE10 with vendor prefixes) but there is a W3C candidate recommendation so maybe it will be standard in future.

Coleman answered 11/12, 2013 at 21:39 Comment(2)
You could use pressurejs to use it. It also seems to supports various other APIs (iOS and Apple pencil)Instinctive
This is now supported in Chrome and Opera too, as well as experimental in Firefox.Woodsy
D
2

Javascript as a programming language in itself has no more ability or lack of ability to read this kind of data than any other language.

The language isn't important. What is important are the APIs available to you from within the language.

Javascript can be run in a number of different environments, some of which may possibly have access to APIs for this kind of hardware. However most Javascript is run in a web browser environment, and this is clearly what you mean.

The web browser environment provides a number of APIs. The most obvious is the DOM, which gives you the ability to manipulate the page, etc. There are other APIs available in the browser as well though. For example, the Geolocation API.

All these are standard APIs which have been defined by the W3C (or in some cases are in the process of being defined by the W3C), meaning that all browsers that support them should make them work the same way.

Unfortunately for you there isn't a standard API for working with pressure pads, so the direct answer to your question is no, it can't be done.

Whether one will become available in the future remains to be seen, but I have my doubts.

There is one way that you can do it though: ActiveX.

ActiveX is an API provided by Microsoft in older versions of IE. It basically provides a way of accessing virtually any Windows DLL code from within the browser.

Since the pressure pen device driver for Windows will be provided as a DLL, this means you should theoretically be able to access it in the browser via an ActiveX control. So therefore yes, you would be able to program it using Javascript.

The bad news, though, is that this is not something I'd recommend. ActiveX as a browser-based technology has long since been abandoned, due to the massive security holes it caused. I don't think the latest versions of IE even support it (I hope not, anyway), which means you'd be forced to use old versions of IE (and only IE - no other browser ever supported it) in order to run your code. Not ideal.

Dripping answered 8/5, 2012 at 23:11 Comment(0)
M
2

there is a way to get Pen pressure, you need to use pointer Events API. There are 3 events:

  • 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}`);
      }
    }
  
}
Mahlstick answered 15/8, 2023 at 21:31 Comment(0)
A
0

No, that's not possible. Probably not even with Flash.

Aguiar answered 8/5, 2012 at 22:15 Comment(0)
R
0

You can only do so in an Native app. Javascript does not have access to pen pressure information

Rooftree answered 8/5, 2012 at 22:16 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.