Giter Site home page Giter Site logo

Comments (13)

lathonez avatar lathonez commented on July 29, 2024 1

Thanks Lucas, will let you know when I've had some time to look into this

from angular2-signaturepad.

akvaliya avatar akvaliya commented on July 29, 2024 1

This should be reopened

from angular2-signaturepad.

akz92 avatar akz92 commented on July 29, 2024

I investigated a little further and found that the problem is actually in szimek/signature_pad. The ratio used when calculating the width and height to use in drawImage for some reason is 2 and that causes both width and height to be half of the actual values.

Removing the ratio and using the values of this._canvas.width and this._canvas.height fixed both the issue in my application and in the angular2-signaturepad-demo.

I didn't raise an issue there because I'm not able to test their latest release now, but since this issue isn't from this component I'm closing it.

from angular2-signaturepad.

lathonez avatar lathonez commented on July 29, 2024

Thanks a lot for the update and investigation

from angular2-signaturepad.

alan345 avatar alan345 commented on July 29, 2024

Hello @akz92 !
I am having the same issue and could not solve it.
Can you please give us more details regarding the resolution? Where did you remove the Ratio as you said "Removing the ratio"

Thanks for your help
I have opened a new issue just in case.
#46

from angular2-signaturepad.

lathonez avatar lathonez commented on July 29, 2024

No need for another issue. Closed #46 as a duplicate of this.

from angular2-signaturepad.

lathonez avatar lathonez commented on July 29, 2024

If there is an issue here at all, it seems to be upstream.

Can't comment further than the excellent summary made by @akz92

from angular2-signaturepad.

akz92 avatar akz92 commented on July 29, 2024

@alan345 I didn't touch this code since I created the issue, so I'm not really sure, but I believe it had to do with these lines from the fromDataURL method:

  var ratio = options.ratio || window.devicePixelRatio || 1;
  var width = options.width || this._canvas.width / ratio;
  var height = options.height || this._canvas.height / ratio;

These are the actual lines I'm using in my app, so if this is where the problem is they should help you 😃

from angular2-signaturepad.

alan345 avatar alan345 commented on July 29, 2024

thanks @akz92 !

from angular2-signaturepad.

DexterHaslem avatar DexterHaslem commented on July 29, 2024

@lathonez can you bump signaturepad to 2.3 in deps so ratio is available in options (and other fixes)?
See https://github.com/szimek/signature_pad/blob/master/src/signature_pad.js#L101 docs seem outdated

from angular2-signaturepad.

DexterHaslem avatar DexterHaslem commented on July 29, 2024

oh wait, it was actually there in 2.2.0 :( it would be nice to update regardless

from angular2-signaturepad.

lathonez avatar lathonez commented on July 29, 2024

@DexterHaslem - commenting on closed issues is a great way of getting your comments ignored.

#55

No idea when we'll have time to action this. The repo is FOSS and PRs are accepted.

Cheers

from angular2-signaturepad.

akvaliya avatar akvaliya commented on July 29, 2024

I am still facing the same issue in version 2.8.0. Can anyone tell me what is the status of this issue.

Why is it closed? Issue is still exist.

from angular2-signaturepad.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.