When an image question's appearance is set to draw or annotate in the Survey123 field app, the question provides the ability to load a canvas that you can sketch on. The draw appearance provides a button to load the canvas by itself, while annotate allows you to take a photo with the device's camera, select an image file, take a snapshot of a map, or use a default image, which you can then sketch on. To learn more, see Draw and annotate appearance.
The canvas for the draw and annotate appearances will be at a maximum resolution set by the survey author. When an image is provided to the annotate canvas, the image displays at the maximum resolution set by the survey author while preserving the provided image's aspect ratio. When a snapshot of a map is provided, the canvas matches the size of the viewable canvas area.
In the upper right corner of a blank annotate canvas is the Image menu, which provides options to take a photo with the device's camera, select an image from the device's storage, or take a snapshot of a map. Once an image or graphic element has been added to the canvas, this menu becomes the Reset menu, allowing you to replace the image or reset to a provided default image. For draw questions, the Reset menu allows you to reset to a blank canvas.
Caution:
Selecting any option on the Reset menu deletes all graphic elements and removes the image from the canvas.
The canvas for draw and annotate questions can be in one of three modes: explore, draw, or edit. You can select the mode from the toolbar at the bottom of the screen.
Explore mode
Explore mode provides several options to zoom or explore the canvas. Click the explore button in the toolbar at the bottom of the screen to put the canvas in explore mode. The following tools are available:
- Fill screen fills the viewable canvas area with the canvas, with potential cropping on one or more sides.
- Fit screen fits the entire canvas in the viewable canvas area.
- 100% zooms the canvas to the actual pixel resolution.
- Zoom in or Zoom out increases or decreases the magnification by 10 percent, respectively.
You can also pan and zoom using touch or mouse controls in this mode.
Draw mode
Draw mode allows you to add graphic elements to the canvas. Click the drawing tool button in the toolbar at the bottom of the screen to put the canvas in draw mode. The drawing tool button changes to reflect the active tool. A preview of the settings for the active drawing tool displays in the corner of the canvas. Click the preview or the drawing tool button to open the drawing tools palette. The following drawing tools are available:
| Drawing tools | Button | Description |
|---|---|---|
Freehand line |  | A freehand line. |
Smart shape |  | The app interprets the shape drawn by a single freehand line as a square, a circle, or a triangle. |
Marker |  | A marker is placed at the point pressed on the canvas. The marker can be changed in the drawing tools palette. |
Label |  | A text box with the center at the point pressed on the canvas. |
Straight line |  | A single straight line from the point at which drawing starts to when it ends. |
Polyline |  | A series of connected straight lines between the first and second points pressed on the canvas, and then the second and third, and so on. |
Arrow |  | A single straight line from the point at which drawing starts to when it ends. An arrowhead is on the ending point. |
Double arrow |  | A single straight line from the point at which drawing starts to when it ends. Arrowheads are on both beginning and ending points. |
For each drawing tool, there are settings for line color and width, text color, and text size. For the smart shape, marker, and label tools, you can also modify the background or fill color. By default, you can add a text label to each graphic element. Click the text button in the drawing tools palette settings to set whether the label is single line, multiline, or disabled. You can also enable a halo effect around the label and specify its color and size.
Set a custom color for a drawing tool using the color picker option in the lower right of the color palette. Adjust the opacity of the drawing tool using the slider on the color palette.
These settings are saved individually for every tool on a per-question basis, allowing each tool to have individual color and size settings for that specific question.
Collapse or expand the settings in the drawing tools palette by clicking the small button at the upper left of the drawing tool buttons. The state of the drawing tools palette is also saved for each question.
Edit mode
Edit mode allows you to select graphic elements on the canvas and edit them. In edit mode you can do the following:
- Move, resize, rotate, and delete graphic elements.
- Add, edit, and delete vertices for polylines.
- Edit the text for a graphic element's label.
- Move, resize, rotate, and delete a graphic element's label, independent of the graphic element.
- Change the drawing order to place a graphic element above or below other graphic elements.
- Undo and redo changes. Be aware that the history of changes will be cleared once you finish editing a graphic element, by either selecting another graphic element or switching to draw mode.
Note:
Edits can only be made to graphic elements that are added in the current session. Once the image is saved and reopened, these graphic elements can no longer be manipulated individually; however, new graphic elements can be added to the image.