--- title: "ClickMap: Smart Form Field Guide (MOC)" description: Clickmap Feature Information --- [Skip to content](https://help.fldata.com/kb/clickmap-smart-form-field-guide-moc#main-content) English Show submenu for translations [Customer portal](https://help.fldata.com/tickets-view?hsLang=en) ![fldata-logo.png\]](https://help.fldata.com/hs-fs/hubfs/fldata-logo.png?height=50&name=fldata-logo.png) Open main navigation Close main navigation - English Show submenu for translations - [Customer portal](https://help.fldata.com/tickets-view) - Go to fldata.com Go to fldata.com How can we help you? - There are no suggestions because the search field is empty. 1. [Frontline Data Solutions EHS Knowledge Base](https://help.fldata.com/kb?hsLang=en) 2. [Management of Change (MOC)](https://help.fldata.com/kb/management-of-change-moc?hsLang=en) 3. [MOC Settings](https://help.fldata.com/kb/management-of-change-moc?hsLang=en#moc-settings) # ClickMap: Smart Form Field Guide (MOC) ## ClickMap is an interactive image selection field available in Smart Forms. It lets administrators upload an image, such as a human body diagram, facility map, or site layout, and define clickable regions on it. When users fill out a form with a ClickMap field, they simply click or tap directly on the image to indicate a relevant area, such as the location of a workplace injury or the zone where an incident occurred. ### **Key Features** **ClickMap Template** ClickMap templates are configured once by an administrator and can then be added to any Smart Form in the MOC or ACT module. A named, reusable configuration that pairs an uploaded image with one or more labeled, selectable regions. Templates are created in Settings and must be scoped to a specific Division. **Mapping** A named interactive region drawn on the template image using either the Rectangle or Polygon tool. Each mapping becomes a clickable area for users completing the form. **Drawing Modes** - **Select** – Click an existing region to select or deselect it. - **Rectangle** – Click and drag to define a rectangular region. - **Polygon** – Click to place each point of a custom shape. Double-click (or click the first point again) to close the shape. **Multi-Select** When enabled on a ClickMap field, users can select more than one region in a single submission. When disabled, only one region can be active at a time. --- ### How It Works ClickMap operates across three modes: **1. Editor Mode (Admin Template Creation)** Administrators use this mode to build and save ClickMap templates. This involves uploading an image, drawing labeled regions using the Rectangle or Polygon tool, naming the template, setting its active/inactive date range, and scoping it to a Company and Division. **2. Selector Mode (User Completing a Form)** When a user opens a Smart Form containing a ClickMap field, the image is displayed with all defined regions visible. The user clicks or taps a region to select it. If Multi-Select is enabled, multiple regions can be chosen. If the field is marked as required, at least one region must be selected before the form can be submitted. **3. Reporting** ClickMap selections are captured and fed into reporting. Users with Report access can view which regions have been selected across submissions by adding ClickMap fields to their custom MOC/ACT Form Field Reports. --- ### How to Configure a ClickMap Template #### Step 1: Navigate to ClickMap Settings - **In MOC:** Go to **MOC \> Settings \> ClickMap** The list view displays all existing templates with their name, creator, last modified date, and other details. #### Step 2: Create a New Template Click **New** to open the template creation page. The page is divided into two panels: **Left Panel — Template Details** - **Template Name** *(required)* – A descriptive label for the template. - **Company** – Select the applicable company. - **Division** – Select the applicable division. - **Active Date** – The date the template becomes available on forms. - **Inactive Date** – The date the template expires and becomes unavailable. **Left Panel — Mapping List** Displays all named regions drawn on the image. Regions can be edited or deleted here. Shows "No Records Found" until at least one region has been mapped. **Right Panel — Image Editor** The image upload and drawing workspace. Upload an image by dragging and dropping a file, or click **Browse** to select one. Supported formats: JPG, PNG, and WEBP. Once an image is loaded, the **Editor Toolbar** appears with three tools: - **Select** – Click a region to select or deselect it. - **Rectangle** – Draw rectangular regions. - **Polygon** – Draw custom shapes. Double-click or click the first point to close the shape. > **Note:** The Save button remains grayed out until all required fields are filled in *and* at least one mapping has been drawn on the image. #### Step 3: Save the Template Once all required fields are complete and at least one region has been drawn, click **Save**. You'll be taken to the Details view of the newly created template. Click **Cancel** at any time to discard your changes and return to the template list. [![2a-clickmap-templates-thumbnail](https://help.fldata.com/hs-fs/hubfs/KB/Thumbnails/2a-clickmap-templates-thumbnail.jpg?width=670&height=392&name=2a-clickmap-templates-thumbnail.jpg)](https://help.fldata.com/hubfs/KB/Videos/Frontline%20Click%20Map%20Templates%20Tutorial.mp4?hsLang=en)   --- ### Pre-Built Templates Frontline includes a standard **Full Body** template out of the box — an anterior human body diagram with common anatomical regions already mapped. It's suitable for injury location forms and available by default in all environments. Administrators can also create custom templates using any image relevant to their site or workflows. --- ### Adding a ClickMap Field to a Smart Form Once a template has been saved, it can be added to any Smart Form in the corresponding module. 1. Open the Smart Form you want to edit in the **Form Builder**. 2. In the **User Inputs** panel on the left, find the **ClickMap** field type (marked as *New*). 3. Drag the ClickMap field onto your form layout. 4. In the field configuration panel, fill in the following: - **Field Title** – The label displayed above the image (e.g., "Mark the location of your injury"). - **Select Template** – Choose a saved ClickMap template from the drop-down. - **Multi Select** – Toggle on to allow multiple region selections. - **Required Field** – Check this to make selection mandatory before submission. - **Report Label** – The label used to identify this field in reports and exports. 5. Click **Save**.   [![2b-clickmap-smartform-thumbnail](https://help.fldata.com/hs-fs/hubfs/KB/Thumbnails/2b-clickmap-smartform-thumbnail.jpg?width=670&height=392&name=2b-clickmap-smartform-thumbnail.jpg)](https://help.fldata.com/hubfs/KB/Videos/Add%20a%20ClickMap%20Template%20to%20SmartForm.mp4?hsLang=en) --- ### Tips & Best Practices - Use high-contrast images with clearly defined areas to make regions easy to identify. - Name mappings descriptively (e.g., "Left Shoulder," "Zone A — Loading Dock") so report output is immediately readable without needing to reference the image. - Use **Polygon mode** for irregular or anatomical regions where a rectangle would be too imprecise. - Set an **Inactive Date** aligned with your diagram review cycle so outdated templates expire naturally and are replaced. - Scope templates to the correct Company and Division to keep the template picker uncluttered for other users. - Enable **Multi-Select** only when multiple simultaneous selections are expected (e.g., "select all affected body parts"). Leave it off for single-location reporting to keep data clean. --- ### Frequently Asked Questions **Can I use the same ClickMap template in both MOC and ACT?** Yes — like Form Trees, ClickMap templates can be used across both modules. You don't need to create separate templates for each. **What image formats are supported?** JPG, PNG, and WEBP. For best results, use PNG for diagrams and line drawings, and JPG or WEBP for photographic site images. **Can end users draw their own regions on the form?** No. Only regions defined by an administrator during template setup are available. Users can only click to select or deselect existing regions. **Why is the Save button grayed out?** The Save button activates only when all required fields (Template Name, Active Date, Inactive Date) are filled in *and* at least one region has been drawn on the uploaded image. **Will ClickMap data appear in my existing reports?** Yes. ClickMap responses are included in Form Field Reports. Each selected region appears as a reportable value in your MOC or ACT reports. - [Management of Change (MOC)](https://help.fldata.com/kb/management-of-change-moc?hsLang=en#main-content) - [MOC Basics](https://help.fldata.com/kb/management-of-change-moc?hsLang=en#moc-basics) - [MOC Settings](https://help.fldata.com/kb/management-of-change-moc?hsLang=en#moc-settings) - [MOC Stages](https://help.fldata.com/kb/management-of-change-moc?hsLang=en#moc-stages) - [Learning Management System (LMS)](https://help.fldata.com/kb/learning-management-system-lms?hsLang=en#main-content) - [LMS People](https://help.fldata.com/kb/learning-management-system-lms?hsLang=en#lms-people) - [LMS Author](https://help.fldata.com/kb/learning-management-system-lms?hsLang=en#lms-author) - [LMS Curriculum](https://help.fldata.com/kb/learning-management-system-lms?hsLang=en#lms-curriculum) - [LMS Classes](https://help.fldata.com/kb/learning-management-system-lms?hsLang=en#lms-classes) - [LMS Settings](https://help.fldata.com/kb/learning-management-system-lms?hsLang=en#lms-settings) - [Events & Action Items (ACT)](https://help.fldata.com/kb/events-action-items-act?hsLang=en#main-content) - [Event Stages and Tasks](https://help.fldata.com/kb/events-action-items-act?hsLang=en#event-stages-and-tasks) - [Action Items](https://help.fldata.com/kb/events-action-items-act?hsLang=en#action-items) - [ACT Settings](https://help.fldata.com/kb/events-action-items-act?hsLang=en#act-settings) - [ACT Basics](https://help.fldata.com/kb/events-action-items-act?hsLang=en#act-basics) - [Contractor Safety Management (CSM)](https://help.fldata.com/kb/contractor-safety-management-csm?hsLang=en#main-content) - [CSM EHS Owners](https://help.fldata.com/kb/contractor-safety-management-csm?hsLang=en#csm-ehs-owners) - [CSM Contractors](https://help.fldata.com/kb/contractor-safety-management-csm?hsLang=en#csm-contractors) - [CSM Contractor Administrators](https://help.fldata.com/kb/contractor-safety-management-csm?hsLang=en#csm-contractor-administrators) - [Reporting](https://help.fldata.com/kb/reporting?hsLang=en) - [Dashboards](https://help.fldata.com/kb/dashboards?hsLang=en#main-content) - [LMS Dashboards](https://help.fldata.com/kb/dashboards?hsLang=en#lms-dashboards) - [MOC Dashboards](https://help.fldata.com/kb/dashboards?hsLang=en#moc-dashboards) - [Action Item Dashboards](https://help.fldata.com/kb/dashboards?hsLang=en#action-item-dashboards) - [Event Dashboards](https://help.fldata.com/kb/dashboards?hsLang=en#event-dashboards) - [Mobile App](https://help.fldata.com/kb/mobile-app?hsLang=en#main-content) - [App Overview](https://help.fldata.com/kb/mobile-app?hsLang=en#app-overview) - [Mobile App Offline](https://help.fldata.com/kb/mobile-app?hsLang=en#mobile-app-offline) - [Technical Services](https://help.fldata.com/kb/technical-services?hsLang=en#main-content) - [Frontline Services](https://help.fldata.com/kb/technical-services?hsLang=en#frontline-services) - [General](https://help.fldata.com/kb/technical-services?hsLang=en#general) [![Chill listening crop-3](https://help.fldata.com/hs-fs/hubfs/fldata-logo.png?width=110&height=24&name=fldata-logo.png "Chill listening crop-3")](https://fldata.com) fldata.com Help Center Copyright © 2026, Frontline Data Solutions