Want to increase the size of Drawing Board

  • Chris_Bartlett
    Asked on December 10, 2020 at 10:51 AM

    Is there a way to increase the height of the drawing area of Drawing Board widget. I was able to increase the width. But when I increased the height it increased the overall height of the widget but not the size of the drawing area.


  • Ashwin JotForm Support
    Replied on December 10, 2020 at 11:53 AM

    Please inject the following custom CSS code in your widget to increase the canvas height:

    .drawing-board-canvas {

      height: 500px !important;

    }

    .drawing-board-canvas-wrapper {

      height: 500px !important;

    }

    The following guide should help you how to inject custom CSS code in your widget: https://www.jotform.com/help/428-how-to-inject-css-codes-to-widgets

    Hope this helps.

    Do get back to us if you have any questions.

  • Chris_Bartlett
    Replied on December 10, 2020 at 3:13 PM

    Thank you.

    Injected the code but it did not work.


    Chris

  • Jed_C
    Replied on December 10, 2020 at 8:11 PM

    First is to remove the image so that the lines are visible when adjusting it.

    1607648265 5fd2c409d3b60 The Easiest Onl Screenshot 10

    Once the lines are all visible, you can inject the CSS code below to increase the height of the Annotate Picture widget.

    #canvas_container {
      height: 1342px !important;
    }

    Guide: https://www.jotform.com/help/428-how-to-inject-css-codes-to-widgets

    You'll also need to increase the frame height of your form. You will then need to inject this CSS into your form's CSS tab.

    iframe#customFieldFrame_161 {
      height: 1500px !important;
    }

    Guide: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    Sample screencast:

    1607649071 5fd2c72f39815 annotate Screenshot 21

    You can adjust the height according to your preference. I hope that helps. Let us know if you have any questions or if you need further assistance.