Bunun nasıl yapılabileceğini bilen var mı? Tuval nesnesi, svg, jQuery vb. Kullanır mısınız?
HTML5 ve iPad kullanarak İmza Yakalama
Yanıtlar:
Değişken genişlikli (çizim hızına dayalı) eğrilere sahip başka bir tuval tabanlı sürüm: http://szimek.github.io/signature_pad adresinde demo ve https://github.com/szimek/signature_pad adresindeki kod .
1
Şimdiden teşekkürler, şimdiye kadar gördüğüm en iyi js imza lib. Bu cevabın neden sadece 3 oyu olduğunu bilmiyorum. github.com/szimek/signature_pad
—
VAdaihiep
Bunun diğer js kütüphanelerine ve ne kadar iyi göründüğüne güvenmediğini seviyorum. Kullanmama yardımcı olan bir not: tuvalin nasıl ayarlandığını görebilmeniz için bir kenarlık ekleyin. Ayrıca, tuvaldeki css değişikliklerinin çılgınca şeyler yaptığını unutmayın, bu yüzden kontrol dışına çıkarsa tuval öğesinde bir yükseklik ve genişlik belirtin.
—
Brian McGinity
Jake, README dosyasında sağlanan belgelerde tam olarak ne eksik? Bunu nasıl geliştireceğime dair önerilere açığım.
—
szimek
Özür dilerim. Bence belgeleriniz aslında yeterli. Bunun ne kadar kolay olduğunu anlayana kadar sınırlı görünüyordu. Tamamen bir formda, veritabanında depolamak ve bir saatten kısa bir süre içinde sayfaya geri almak var. Sanırım, yukarıdaki seçilen cevap gibi kullanmak için çok daha karmaşık kütüphanelerle karşılaştırıyordum. Daha önce veri URI'leriyle çalışmamıştım, ancak verilerin depolanmasını ele almanın gerçekten mükemmel bir yoludur. Yani, kendimi bunlara alışmak zorunda kaldım ve sonra veritabanında depolamak ve almak çok ... kolay ... vay. Tekrar teşekkürler!
—
Jake
@RonaldinhoLearnCoding README dosyasını kontrol edin - olası tüm seçeneklerin bir listesi vardır. Aradığınız kişiye "penColor" denir.
—
szimek
Bazı JavaScript'lere sahip bir tuval öğesi harika çalışır.
Aslında, Signature Pad (bir jQuery eklentisi) zaten uygulanmıştır.
Bu eklentinin ne kadar güzel olduğuna şaşıyorum.
—
Gourneau
Mükemmel! Paylaşım için teşekkürler!
—
sagescrub
Bu eklentiyi kullanışsız kullanmak gerçekten zor buldum. Tüm demolar çok özel ve uygulanması zor. Kesinlikle diğer imza pedi yaklaşımı daha iyi gibi: stackoverflow.com/a/17200715/76672 Hemen hemen hiçbir belge ile, çalışmasını başardım ...
—
Jake
İşte az önce yaptığım SVG kullanarak bunun hızlı bir şekilde saldırıya uğramış bir versiyonu . İPhone'umda benim için iyi çalışıyor. Ayrıca normal fare olaylarını kullanarak bir masaüstü tarayıcısında çalışır.
Kaydedilmiş bir imza nasıl çizileceğini bilmek istiyorum
—
Yuri Morales
İmzayı png dosyası olarak nasıl kaydedebilir veya imzayı başka bir şekilde nasıl gösterebilirim?
—
Andrus
Belki de bunun için en iyi iki tarayıcı teknolojisi, Flash'ın yedek olduğu Tuval'dir.
IE'de VML'yi Canvas için yedek olarak denedik, ancak Flash'tan çok daha yavaştı. SVG diğerlerinden daha yavaştı.
JSignature ( http://willowsystems.github.com/jSignature/ ) ile Canvas'ı birincil olarak kullandık, IE8 ve daha azı için Flash tabanlı Canvas emülatörüne (FlashCanvas) geri dönüş ile. Bizim için çok iyi çalıştı derim.
Bu çok hoş ... Pürüzsüzleştirici efektlerden hoşlanıyorum. En iyi ben gördüm.
—
Camden
Zaten listelenen seçenekler çok iyi, ancak burada araştırdım ve karşılaştığım bu konuda birkaç tane daha.
1) http://perfectionkills.com/exploring-canvas-drawing-techniques/
2) http://mcc.id.au/2010/signature.html
3) https://zipso.net/a-simple-touchscreen -sketchpad-using-javascript-ve-html5 /
Ve her zamanki gibi tuvali görüntüye kaydetmek isteyebilirsiniz:
http://www.html5canvastutorials.com/advanced/html5-canvas-save-drawing-as-an-image/
iyi şanslar ve mutlu imzalar
Başka bir OpenSource imza alanı https://github.com/applicius/jquery.signfield/ , Sketch.js kullanan kayıtlı jQuery eklentisidir.