Custom Code

Custom code enables administrators to add profile-specific logic and styling that runs after the map has loaded. This feature allows you to:

• Inject custom JavaScript to extend or modify map behavior (e.g., add event listeners, automate workflows, or integrate with external APIs).
• Apply custom CSS to override or enhance the default map and UI styles for a tailored appearance.
• Implement custom validation logic to enforce business rules or data integrity specific to your organization's needs.

Custom code is managed per configuration profile, giving you granular control over the user experience and map functionality for different scenarios.

Custom JS

There are a few important requirements to ensure your custom functions work correctly:

Requirement	Description
Use globalThis	Define your function on globalThis so it is accessible to the map control.
Parameter Handling	All parameters are passed as strings; always parse them using let paramsJSON = JSON.parse(parameters);.
Dynamic Variables	To insert dynamic values, use double curly braces ({{}}). Pass parameters as a JSON string, e.g. { "userId": "{{userId}}" }.

Here is an example:

console.log('Maptaskr Power Maps has loaded')

globalThis.getAuthUser = function(parameters) {
  let paramsJSON = JSON.parse(parameters);
  let {userId, userName } = paramsJSON;
  console.log(userId, userName)
  alert(`Hi my name is ${userName} and my id is ${userId}`)
}

This function is then called with in the Map Actions as a Action type ExecuteJS

---

Custom CSS

The custom CSS editor empowers administrators to tailor the look and feel of the map control for each configuration profile. You can apply custom branding, adjust styles, and even hide or show specific features—ensuring every user group has a unique and targeted experience. This flexibility allows you to align the map interface with your organization's branding or adapt it for different scenarios.

---

Custom Validation

Custom validation is triggered when a user submits a shape. If your business requirements go beyond standard validation, you can add custom logic here. This extends the configuration created when adding predefined shapes in Shape Definitions, allowing you to enforce advanced rules and ensure data integrity during shape submission.

Example: Require a Name for Every ShapeW

Suppose you want to ensure that every shape submitted by a user includes a "Name" attribute. You can add the following custom validation function:

// This function will be called on shape submission
function validateShapeSubmission(controlId) {
  if (!shape.attributes || !shape.attributes.Name || shape.attributes.Name.trim() === "") {
	return false
  }else{
    return true 
  }
}

This validation will prevent users from submitting shapes without a name and display a helpful message. You can expand this logic to check for other required fields, enforce naming conventions, or implement more advanced business rules.