webentwicklung-frage-antwort-db.com.de

Capture Signature mit HTML5 und iPad

Weiß jemand, wie das geht? Würden Sie ein Canvas-Objekt, svg, jQuery usw. verwenden?

149
Mark Richman

Hier ist eine andere Canvas-basierte Version mit variabler Breite (basierend auf der Zeichengeschwindigkeit) der Kurven: Demo unter http://szimek.github.io/signature_pad und Code unter https://github.com)/szimek/signature_pad .

signature sample

291
szimek

Ein Canvas-Element mit etwas JavaScript würde hervorragend funktionieren.

Tatsächlich hat Signature Pad (ein jQuery-Plugin) dies bereits implementiert.

58
Ben S

Hier ist eine schnell gehackte Version davon mit SVG Ich habe es gerade getan. Funktioniert gut für mich auf meinem iPhone. Funktioniert auch in einem Desktop-Browser mit normalen Mausereignissen.

15
heycam

Die wahrscheinlich besten beiden Browser-Technologien sind Canvas mit Flash als Backup.

Wir haben VML auf IE als Backup für Canvas verwendet, aber es war viel langsamer als Flash. SVG war langsamer als der Rest.

Mit jSignature ( http://willowsystems.github.com/jSignature/ ) haben wir Canvas als primäre Methode verwendet, mit einem Fallback auf den Flash-basierten Canvas-Emulator (FlashCanvas) für IE8 und weniger. Id 'say hat bei uns sehr gut funktioniert.

12
ddotsenko

Die bereits aufgelisteten Optionen sind sehr gut, hier jedoch noch ein paar zu diesem Thema, das ich recherchiert habe und auf das ich gestoßen bin.

1) http://perfectionkills.com/exploring-canvas-drawing-techniques/
2) http://mcc.id.au/2010/signature.html
3) https://zipso.net/a-einfach-touchscreen-sketchpad-mit-javascript-und-html5/

Und wie immer möchten Sie vielleicht die Leinwand als Bild speichern:
http://www.html5canvastutorials.com/advanced/html5-canvas-save-drawing-as-an-image/

viel glück und viel spaß beim unterschreiben

2
Luigi D'Amico

Ein weiteres OpenSource-Signaturfeld ist https://github.com/applicius/jquery.signfield/ , ein mithilfe von Sketch.js registriertes jQuery-Plugin.

0
cchantep