The Original FileMaker Community
Business Templates - Demo Apps - Video Tutorials -Samples - Help - 46000 Member Forum

The Leading Filemaker Developer Tools

FM Draw Add-On | DB Services

Ethan Yoder 

Posted on 
November 19th, 2020 


Free Downloads

The ability to markup images has become a standard feature across different programs and operating systems. With our new FileMaker add-on, FM Draw, you’ll be able to write on images in just a few simple steps. Whether you’re looking to make notations to a design or highlight sections of an image, we have you covered.

Installing the Add-On

To make the FM Draw add-on available to your file, you’ll need to do the following:

  1. Completely close FileMaker Pro. Make sure you’re using 19.1.3 or above.
  2. Unzip the custom add-on.
  3. Move the custom add-on folder into your AddonModules folder. On Mac, you may need to press “Command+Shift+Dot” to view one of the hidden folders in this file path.
     •       Mac: /Users/username/Library/Application Support/FileMaker/Extensions/AddonModules
     •       Windows: UsersusernameAppDataLocalFileMakerExtensionsAddonModules
  4. Open up the FileMaker file that needs the add-on. If you want to sketch on a specific field, make sure to navigate to a layout with a context based on that field’s table.
  5. Enter layout mode and open the “Add-ons” tab. Click the “+” button at the bottom of the panel.
  6. In here, you should see the add-on in the “JavaScript” section. Select the add-on and click “Choose”. This step should import FM Draw into your system.
  7. Click and drag the add-on onto your layout. This will add FM Draw to the layout. Feel free to resize the web viewer to whatever size you need. You can also drag the add-on onto the layout multiple times for multiple drawing windows.

If you are using FM Draw on FileMaker Go, make sure your layout’s dimensions aren’t larger than your device’s dimensions. If this happens, you may accidentally drag the window around instead of drawing on the canvas.

A screenshot of the FM Draw installation process.

Setting Up FM Draw

Once you’ve installed the add-on, you can configure your FM Draw window in the settings panel by clicking the gear icon.

  • Input Container Field: This allows you to select a container field. Any image (jpg, png, gif) in that field will be placed in the canvas. The dropdown options will be pulled from the layout context your web viewer was placed on.
  • Save Image Method: This allows you to change how your image is saved. You can either chose to save your canvas to a file path or into another container field.
  • Output Container Field: This allows you to select a container field. When you click the save button, your canvas will be placed into this field. The dropdown options will be pulled from the layout context your web viewer was placed on.
A screenshot of the FM Draw options dialog

Once everything is setup, you can start drawing! You have several tools to choose from: pencil (freehand drawing), rectangle, circle, arrow, and drag. The first four will create elements on your canvas, while drag will allow you to move or modify elements. If you would like to remove an element, you can select it with the drag tool and move it off the canvas. You can also change the color of your elements using the color selector on the left side. If you would like to reset your image, you can click the “refresh” button to start over.

And example of FM Draw in action


In just a few minutes, you can integrate your FileMaker solution with FM Draw! You can markup images inside of your database or start from scratch. Save time by drawing directly in FileMaker with no 3rd party program required. Please contact us if you need further assistance or to discuss getting FM Draw into your FileMaker solution.

Did you know we are an authorized reseller for FileMaker Licensing?
Contact us to discuss upgrading your FileMaker software.


Download the FM Draw Database

Please complete the form below to download your FREE FileMaker database file.

Ethan Yoder thumbnail
Ethan Yoder

Ethan is a hard-working, focused application developer who employs his expertise in database and interface design to produce creative outcomes for clients. His steady demeanor, receptiveness to new ideas, and willingness to help is a recipe for success in working with both colleagues and customers.

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More