Signature_pad: changer la couleur de fond à la volée

Créé le 19 nov. 2015  ·  4Commentaires  ·  Source: szimek/signature_pad

Hé,

lors de l'initialisation, le pavé de signature (toile) est défini sur une couleur spécifique, mais je souhaite l'enregistrer sur un fond transparent ou blanc. J'ai déjà utilisé la fonction removeBlanks du prototype lié pour capturer uniquement la signature mais le bg reste rgb (255,243,204) j'essaie de le changer via
signaturePad.backgroundColor = rgb(255, 255, 255); mais il semble que lors de la signature du trait, l'image base64 a déjà été enregistrée.

Des idées?

Commentaire le plus utile

Peut-être qu'un simple échange de couleurs avant de l'envoyer au serveur fonctionnerait ? Vous pouvez obtenir des données d'image brutes en utilisant CanvasContext2D#getImageData() , itérer sur chaque pixel et échanger la couleur d'arrière-plan visible (entier 8 bits) vers celle souhaitée. Enregistrez les données d'image modifiées dans un canevas hors écran et lisez-les à l'aide Canvas#toDataURL() . Pourrait fonctionner :)

D'AILLEURS. La couleur d'arrière-plan est appliquée lorsque le canevas est effacé, donc uniquement lors de l'initialisation ou lorsque vous appelez explicitement SignaturePad#clear() .

Tous les 4 commentaires

Peut-être qu'un simple échange de couleurs avant de l'envoyer au serveur fonctionnerait ? Vous pouvez obtenir des données d'image brutes en utilisant CanvasContext2D#getImageData() , itérer sur chaque pixel et échanger la couleur d'arrière-plan visible (entier 8 bits) vers celle souhaitée. Enregistrez les données d'image modifiées dans un canevas hors écran et lisez-les à l'aide Canvas#toDataURL() . Pourrait fonctionner :)

D'AILLEURS. La couleur d'arrière-plan est appliquée lorsque le canevas est effacé, donc uniquement lors de l'initialisation ou lorsque vous appelez explicitement SignaturePad#clear() .

@szimek merci pour la réponse. Je cherchais également à utiliser la fonction removeBlanks pour cela. Je dois juste comprendre comment savoir s'il s'agit d'un pixel d'arrière-plan ou d'un pixel de signature.

Existe-t-il également un moyen d'obtenir la représentation du tableau json de la signature
c'est-à-dire {lx : 20, ly : 34, mx : 20, my : 34}

Malheureusement pas pour le moment. Seuls les 4 derniers points sont conservés en mémoire, il n'y a donc aucun moyen d'accéder à tous les points. Cela pourrait changer à l'avenir, mais il existe d'autres problèmes (principalement liés aux écrans rétiniens/non rétiniens) avec une priorité plus élevée.

Cependant, vous pouvez facilement modifier la bibliothèque pour stocker tous les points si vous avez vraiment besoin de ces données.

@khawye Si vous avez d'autres questions, veuillez rouvrir ce problème.

Cette page vous a été utile?
0 / 5 - 0 notes

Questions connexes

hostcia picture hostcia  ·  6Commentaires

lowe493 picture lowe493  ·  5Commentaires

erangaapp picture erangaapp  ·  8Commentaires

MarcGodard picture MarcGodard  ·  8Commentaires

auam88 picture auam88  ·  4Commentaires