Draw On Image Size

  • Profile Image
    Asked on January 01, 2016 at 07:31 PM

    I seem to keep having a problem sizing the draw on image...My image is on my website as 520 x 390 which is the same dimensions as the widget yet it gets cut off. Obviously I want mobile users to be able to utilize this so what size should my form be and what side do I make the photo on my hosting site and in the widget? Thanks

  • Profile Image
    Answered on January 01, 2016 at 11:07 PM


    Thank you for contacting us.

    Just add this CSS code as the image below, and the background image will be displayed properly in the widget : 




    Hope this will help you.


  • Profile Image
    Answered on January 02, 2016 at 02:00 AM

    Fantastic..thanks..one more question..is there a way to have the drawn on image show up on a different page in the form after someone has drawn on it?
    If a patient was to draw on the image and answer a few questions I would like to be able to view their image later in the form. 

  • Profile Image
    Answered on January 02, 2016 at 07:14 AM

    On behalf of my colleague, Kevin, you are most welcome. :)

    When it comes to displaying the same image that was already drawn-on later in the form, I'm afraid that this is not currently possible because the image is created only after the form has been submitted. Until then, the image and the drawing overlay exist separately inside the widget, and are only merged into an actual image when the form is submitted.

    Since the image does not exist before the form is submitted, the only way to view it is to actually view the Draw On Image widget itself, the one in which it has been drawn. As you navigate back and forth through pages of the form, all other pages of the form are hidden.

    This means that in order to show the Draw On Image widget from page 1 on a different page, the workarounds to achieve it would require displaying page 1 at the same time with that second page where you would be on, which would also cause clashes in the layout / design of that other page of the form.

    If you need assistance with anything else, please don't hesitate to open a new thread about it, and we will be happy to help.

  • Profile Image
    Answered on February 27, 2016 at 03:17 AM

    Hello...when I draw on an image it does not match up in the submission ...and fix to this? https://form.jotform.com/43064227151143

  • Profile Image
    Answered on February 27, 2016 at 04:43 AM

    Sorry about this, it seems that the CSS for changing background-size for the image is not playing well with drawing on the image.

    Please try re-sizing your image in an image manipulation program to be the size of 610 X 610, as this is the size of the image displayed on the form, and it should be working correctly after that. You will no longer need the CSS for changing the background size.

    Your current image is of size 1054 x 1024, so here is a resized version that you could use:

    I have tested the resized image, and it appears to be working fine, this is on the form:

    And this is how it turned out in the submission:

    Please try it out and let us know how it goes.