jSignature icon indicating copy to clipboard operation
jSignature copied to clipboard

Save whole signature field

Open nuketownhf opened this issue 6 years ago • 8 comments

Hello, currently the signature pad is saving only the drawn signature, is it possible to get the whole canvas field as a signature?

that's how it is currently: https://i.imgur.com/5tdOjB3.png and I want it to look like: https://i.imgur.com/P7s2aYl.png

How can I achieve this?

thanks

nuketownhf avatar Oct 01 '19 12:10 nuketownhf

Try setting the width and height of the canvas when initialising jsignature

brinley avatar Oct 02 '19 08:10 brinley

Hello, thanks for the quick response, if I change it to: $(document).ready(function() { $("#signature").jSignature({ color:"black", lineWidth:5, height:100, width: 100

  });
})

it will let my CANVAS where I draw the signature smaller as seen here https://i.imgur.com/sdrRqe0.png

but i want a margin in the signature(image) and not the canvas

nuketownhf avatar Oct 02 '19 08:10 nuketownhf

I think you might need to resize the canvas before you save. You could export the data from jsignature and import into a hidden canvas instance then resize that hidden canvas

brinley avatar Oct 02 '19 08:10 brinley

Hello, I'll try to clarify it with an image: https://i.imgur.com/rcIP2bc.png so basically the black box is the box where I can draw the signature the blue box is the signature that I will get cropped exactly as seen in the image as base64-image. But what I need is the full GREEN box as image and not the raw signature as seen in the blue box. is this possible? thanks

nuketownhf avatar Oct 02 '19 09:10 nuketownhf

I mean somewhere in the javascript file its defined that the first pixel and the last pixel of the signature drawing should be taken

nuketownhf avatar Oct 02 '19 09:10 nuketownhf

Does having a signature line help you tell the user to sign in the middle? Otherwise there's no way other than you resizing the signature just before you export the data

brinley avatar Oct 02 '19 09:10 brinley

by the way if I draw points at the corners the image result will look exactly how I want the image to be https://i.imgur.com/GFFYfBc.png

regarding resizing the signature before the export, how could I do that so it looks like the image above? thanks

nuketownhf avatar Oct 02 '19 09:10 nuketownhf

What is your use case and why do you want to save with the padding?

brinley avatar Oct 02 '19 10:10 brinley