GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → shuding → Apple Pencil Safari Api Test

shuding / Apple Pencil Safari Api Test

Canvas sketch board, force touch, real-time Bezier curve.

Programming Languages

javascript
184084 projects - #8 most used programming language

Labels

canvasbezier

Projects that are alternatives of or similar to Apple Pencil Safari Api Test

Micro Racing
🚗 🏎️ 🎮 online 3D multiplayer neural networks based racing game
Stars: ✭ 100 (-47.09%)
Mutual labels:  bezier, canvas
Curvejs
Made curve a dancer in HTML5 canvas - 魔幻线条
Stars: ✭ 1,251 (+561.9%)
Mutual labels:  bezier, canvas
Beziermaker.js
arbitrary order bézier-curve generator
Stars: ✭ 277 (+46.56%)
Mutual labels:  bezier, canvas
Wechart
Create all the [ch]arts by cax or three.js - Cax 和 three.js 创造一切图[表]
Stars: ✭ 152 (-19.58%)
Mutual labels:  bezier, canvas
Tilemap
Rectangular tilemap implementation for PixiJS
Stars: ✭ 177 (-6.35%)
Mutual labels:  canvas
Drawingboard.js
A canvas based drawing app that you can integrate easily on your website.
Stars: ✭ 2,072 (+996.3%)
Mutual labels:  canvas
Rxdownloader
Demo of Downloading Songs/Images through Android Download Manager using RxJava2
Stars: ✭ 166 (-12.17%)
Mutual labels:  canvas
Funvas
Fun canvas animations in Flutter based on time and math functions.
Stars: ✭ 164 (-13.23%)
Mutual labels:  canvas
Json2canvas
通过json直接在canvas上绘制图像,支持小程序和浏览器.
Stars: ✭ 189 (+0%)
Mutual labels:  canvas
Html5 Canvas Game Boilerplate
Provides a set of default code that makes getting up and running with an HTML5 canvas game very easy.
Stars: ✭ 182 (-3.7%)
Mutual labels:  canvas
Diffre
Neon Progress indicator useful for event progress like views. Proof of concept.
Stars: ✭ 176 (-6.88%)
Mutual labels:  canvas
Stock Chart
基于 canvas 的沪深两市股票分时 K 线图
Stars: ✭ 170 (-10.05%)
Mutual labels:  canvas
Vue Grid Canvas
A vue component, it can generate a similar excel form for you
Stars: ✭ 179 (-5.29%)
Mutual labels:  canvas
Pictool
A front-end image processing gadget
Stars: ✭ 168 (-11.11%)
Mutual labels:  canvas
Romantic Words
一个表白用的页面
Stars: ✭ 184 (-2.65%)
Mutual labels:  canvas
Welabx G6
welabx - antv G6
Stars: ✭ 163 (-13.76%)
Mutual labels:  canvas
Pixi Haxe
Externs of Pixi.js for Haxe
Stars: ✭ 175 (-7.41%)
Mutual labels:  canvas
React Countdown Clock
HTML5 canvas countdown clock React component
Stars: ✭ 182 (-3.7%)
Mutual labels:  canvas
Black
World's fastest HTML5 2D game engine   🛸
Stars: ✭ 174 (-7.94%)
Mutual labels:  canvas
Picasso.js
A charting library streamlined for building interactive visualizations for the Qlik product suites.
Stars: ✭ 175 (-7.41%)
Mutual labels:  canvas
View All Similar Projects ➔

Screenshot

3D Touch / Force Touch API Demo

A canvas demo featuring:

  • Apple Pencil and 3D Touch pressure detection
  • smooth Bezier curve drawing

In vanilla JS. Tested in Safari & Google Chrome on iOS 9.3.

Demo | Code.

Help me test on Android/Windows/macOS devices and leave an issue please!

API Capability (Apple devices with iOS 9) Capability (Apple devices with iOS 13)
force ✅ ✅
radiusX ❌ ✅
radiusY ❌ ✅
rotationAngle ❌ ❓
touchType ❓ ✅
altitudeAngle ❓ ✅
azimuthAngle ❓ ✅

To visualize altitudeAngle and azimuthAngle (source: Apple):

Apple Pencil

Related Resources

  1. Touch Events - Level 2, W3C Draft
  2. The Touch Object on MDN
  3. radiusX
  4. Illustrating the Force, Altitude, and Azimuth Properties of Touch Input

Pointer Events & Polyfills

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].