Change the Default Behavior of Components

Many of the behaviors of Geocortex Web's built-in components are configurable through the app config.

tip

Many behaviors which are configurable through the app config are more easily configurable by using the Geocortex Web Designer. App config should be used if you need to modify a property not available in the app config, or use a custom command as part of a command chain.

Prerequisites#

  • Follow along by setting up the Geocortex Web SDK and editing the minimal layout and app config provided.
  • Check out the deployment instructions to learn about how to deploy layout and app config to an application.

Change the Behavior of the Bookmarks Component#

The following example demonstrates changing the onClick property of the bookmarks model. The default value of this property is the singular command, map.zoom-to-viewpoint. This property is not available to edit through the Geocortex Web Designer, but can be edited through the use of app config.

First, let's create a basic map with a bookmarks component using the layout and app config. Start up the application and add a few bookmarks.

app/layout.xml
<?xml version="1.0" encoding="UTF-8"?>
<layout xmlns="https://geocortex.com/layout/v1" xmlns:custom="your.custom.namespace" xmlns:web="https://geocortex.com/layout/web/v1">
<map>
<web:bookmarks/>
</map>
</layout>

Next, add a app item to the configuration for the bookmarks component.

app/layout.xml
<?xml version="1.0" encoding="UTF-8"?>
<layout xmlns="https://geocortex.com/layout/v1" xmlns:custom="your.custom.namespace" xmlns:web="https://geocortex.com/layout/web/v1">
<map>
<web:bookmarks config="bookmarks-config"/>
</map>
</layout>

Finally, modify the onClick property of the bookmarks app item to run the commands map.zoom-to-viewpoint and ui.alert.

app/app.json
{
"schemaVersion": "1.0",
"items": [
{
"id": "bookmarks-config",
"$type": "bookmarks",
"onClick": [
"map.zoom-to-viewpoint",
{
"name": "ui.alert",
"arguments": {
"message": "Message from config."
}
}
]
}
]
}

Congratulations! You just changed the default behavior for a built in component using config. All components can be configured through the app config JSON in this manner.

Next Steps#

Geocortex Web comes with many built-in commands and operations to help you accomplish your goal. If these are not enough, Geocortex Workflow can help you implement custom behaviors without writing custom code. If you cannot create the behavior you want with Geocortex Workflow, it might be time to look into using the Geocortex Web SDK to implement a custom command or operation.

Commands, Operations, and Events API

Check out the available commands and operations

Run a Workflow using a Command and App Config

Configure a workflow to run on map initialization using app config

Change Geocortex Web's Default Map Click Behavior

Learn how to Geocortex Workflow to override Geocortex Web's default map click behavior

Implement Custom Command/Operation

Implement a custom Command/Operation with the Geocortex Web SDK