General information
As already described in the General Information, two integration approaches can be used. Although the iframe-integration approach circumvents CORS related issue, for completeness the div integration approach is described here.
Please note that this usually requires that both, the mapviewer application itself and your application, using the mapviewer, need to run in the same domain. Otherwise, CORS related issues might occur and/or the application is not fully functional.
Technical information
By integrating the mapviewer within a standard div element (this means, no iframe element), you need to start by initializing a mapviewer instance by your own. This is mainly done by importing the booj.js library, which offers the overall functionality. Using the apprt framework, config related properties can be set (although this is usually not needed) by calling $apprt.changeConfig.
Using the $apprt.startApp-function, the desired mapviewer application is initialized.
Technical demonstration
Find below the technical implementation.
Warning! Although the below website is referenced as an iframe, the application instance itself is realized using the div approach. Referencing to the iframe is just because of the overall developer documentation approach.
Custom integration API starting settings
If you need custom settings for your integration API, e.g. a custom eventName for the integrationApiReady event, you can set some changes into your $apprt config:
$apprt.changeConfig({
ct: [
// add properties which defines eventname
integrationAPIConfig: {
//Defines the EventTypeName to which the map application should listen.
//Ensure that your custom-application also use the same EventTypeName for your custom eventLister
eventName: "customEventTypeForDIVIntegration",
//Special case for the "integrationApiReady" event and if more than one map application are used!
//Target identifier will be returned by the "integrationApiReady" event, so the concrete mapviewer application state is present
target: "customTarget",
//ensure that all integrationAPI calls are processed synchronously
"waitForIntegrationAPICall": true
}
]
}