We developed a geocard widget for workzone. We used the arcgis library to show a map. The widget is shown correctly but when we navigate to another tab page of the workspace a javascript error occurs. Looks like the workzone (sap jam) libaries interfere with the arcgis library. Is there anyone who can help with a certain solution?
Details are below.
Tabpage showing the geocard widget
Switch to another tabpage
Javascript error
Uncaught Error: undefinedModule
at p (init.js:8:46)
at aa (init.js:15:194)
at h (init.js:8:145)
at Object.e.core.modifyUniversalSearchForContextOptions (jam_1-dcb89e92b5087066fb495babe5bdeb93dd1d96a48420d2105f5a3ff827831f52.js:112:10350)
at HTMLDocument.<anonymous> (jam_1-dcb89e92b5087066fb495babe5bdeb93dd1d96a48420d2105f5a3ff827831f52.js:113:116)
at HTMLDocument.dispatch (jquery-9fa10aac19270ed292eba66175d1f8eb72ae0b2969d0e618f879874a0377ae34.js:3:16693)
at HTMLDocument.y.handle (jquery-9fa10aac19270ed292eba66175d1f8eb72ae0b2969d0e618f879874a0377ae34.js:3:14669)
at Object.trigger (jquery-9fa10aac19270ed292eba66175d1f8eb72ae0b2969d0e618f879874a0377ae34.js:4:7201)
at HTMLDocument.<anonymous> (jquery-9fa10aac19270ed292eba66175d1f8eb72ae0b2969d0e618f879874a0377ae34.js:4:7807)
at Function.each (jquery-9fa10aac19270ed292eba66175d1f8eb72ae0b2969d0e618f879874a0377ae34.js:2:13304)
Sources
file: ArcGis.jsIn the code below the arcgis library will be initialized.
jQuery.sap.registerModulePath("arcgis_server", "https://js.arcgis.com/4.20/");
sap.ui.define([
"arcgis_server/init"
], () => ({
require: require
}));
file: Main.controller.js
In the code below the map of the arcgis will be 'shown'.
sap.ui.define([
"sap/ui/core/mvc/Controller",
"nl/xxxxx/workzone/geocard/libs/test",
"nl/xxxxx/workzone/geocard/util/ArcGis"
], (Controller, test, ArcGis) => {
"use strict";
return Controller.extend("nl.xxxxx.workzone.geocard.Main", {
onInit: function() {
test.helloworld();
this.initializeMap("arcgis-navigation", "geomap", [-122.3321, 47.6062], 12);
},
initializeMap(baseMapName, mapDivId, centerPoint, zoomLevel) {
ArcGis.require([
"esri/config",
"esri/Map",
"esri/views/MapView",
"esri/widgets/Search",
"dojo/domReady"
], (Config, Map, MapView, Search, ready) => {
ready(() => {
Config.apiKey = "<fill your own>";
// basemap acrgis-navigation => // API-key needed!
// streets => no API-key needed
const map = new Map({
basemap: baseMapName
});
const view = new MapView({
container: mapDivId,
map: map,
center: centerPoint,
zoom: zoomLevel
});
// Create search widget
const search = new Search({
view: view
});
// Add search to the map
//view.ui.add(search, "top-right");
// Find places
const locatorUrl = "http://geocode-api.arcgis.com/arcgis/rest/services/World/GeocodeServer";
});
});
}
});
});