Wep Map is not loading

banu — Thu, 04 Jul 2024 07:07:48 GMT

ArcGIS webmap is not loading on PowerBi report server. It throws below error on inspect page

la.arcgis.com/crl/2024.1.1/nls/cldr-en-us.json:1
Failed to load resource: the server responded with a status of 404 ()

la.arcgis.com/crl/2024.1.1/nls/common-en-us.json:1
Failed to load resource: the server responded with a status of 404 ()

la.arcgis.com/powerbi/2024_1/nls/app-en-us.json:1
Failed to load resource: the server responded with a status of 404 ()

And after refreshing the page map is loading and popup the error "and errCannot destructure property 'user' of 'e' as it is null." Could anyone help me to fix the issue?.

Best Regards,

Isakki

Re: Wep Map is not loading

rber — Thu, 18 Jul 2024 14:45:31 GMT

Me and some colleagues are having the same issue. Did you solve the problem?

Re: Wep Map is not loading

luckachi — Thu, 22 May 2025 17:43:01 GMT

I am having a similar issue...causing all but one ArcGIS map to not meet requirements even though they all got green checks for validation.

la.arcgis.com/powerbi/2024_2/nls/app-en-us.json:1
Failed to load resource: the server responded with a status of 404 ()

la.arcgis.com/crl/2025.1.2/nls/common-en-us.json:1
Failed to load resource: the server responded with a status of 404 ()

la.arcgis.com/crl/2025.1.2/nls/cldr-en-us.json:1
Failed to load resource: the server responded with a status of 404 ()

Re: Wep Map is not loading

banu — Wed, 11 Feb 2026 07:41:43 GMT

let filterValues;
let view, buildinglayer, layer1, layer2, layer3, layer4, searchWidget, sources, searchContainer, renderer, results, orgListjson, legend, isSingle;
let featureLayerView, DivisionIds, GroupIds, DeptIds;
const attributeField = "URECD.URFloor2.ORGN_CD";

const [MapView, Map, FeatureLayer, ImageryLayer, GraphicsLayer, Graphic, geometryEngine, Search, Home, Expand, SketchViewModel, geometryEngineAsync, LayerList, AreaMeasurement2D, Legend] = await $arcgis.import([
"@arcgis/core/views/MapView.js", "@arcgis/core/Map.js", "@arcgis/core/layers/FeatureLayer.js", "@arcgis/core/layers/ImageryLayer.js",
"@arcgis/core/layers/GraphicsLayer.js", "@arcgis/core/Graphic.js", "@arcgis/core/geometry/geometryEngine.js", "@arcgis/core/widgets/Search.js",
"@arcgis/core/widgets/Home.js", "@arcgis/core/widgets/Expand.js", "@arcgis/core/widgets/Sketch/SketchViewModel", "@arcgis/core/geometry/geometryEngineAsync.js",
"@arcgis/core/widgets/LayerList.js", "@arcgis/core/widgets/AreaMeasurement2D.js", "@arcgis/core/widgets/Legend.js"
]);

import { HRconfigLayersFloor2, HRconfigLayersFloor1 } from '/js/renderer.js';

export async function renderMap(FloorNumber, orgList) {
const mapImage = document.getElementById("map-image");
const loader = document.getElementById("loader");
if (mapImage) {
mapImage.style.display = "block";
}
if (loader) {
loader.style.display = "flex";
}

const map = new Map({
//basemap: "satellite"
});
view = new MapView({
container: "view-div",
map: map,
center: [50.121830, 26.313973],
zoom: 21,
ui: {
components: ["attribution"],
},
spatialReferenceLocked: true,
popup: {
dockOptions: { // Dock the popup to the top of the map
buttonEnabled: false
},
visibleElements: { closeButton: false, collapseButton: false, heading: false, actionBar: false }
} // longitude, latitude,
});

view.on("mouse-wheel", (event) => {
event.stopPropagation();
});
view.on("double-click", ["Control"], (event) => {
event.stopPropagation();
});
view.on("double-click", (event) => {
event.stopPropagation();
});
view.on("key-down", (event) => {
const prohibitedKeys = ["+", "-", "Shift", "_", "="];
const keyPressed = event.key;
if (prohibitedKeys.indexOf(keyPressed) !== -1) {
event.stopPropagation();
}
});
view.on("drag", (event) => {
event.stopPropagation();
});

buildinglayer = new FeatureLayer({
url: configLayers.find((layer) => layer.id === "buildinglayer").url,
outFields: ['*']
});
layer1 = new FeatureLayer({
url: configLayers.find((layer) => layer.id === "layer1").url,
outFields: ["*"]
});
layer2 = new FeatureLayer({
url: configLayers.find((layer) => layer.id === "layer2").url,
outFields: ["*"]
});
layer3 = new FeatureLayer({
url: configLayers.find((layer) => layer.id === "layer3").url
});

// Create unique value infos
map.add(buildinglayer, 0);
map.add(layer1, 1);
map.add(layer2, 2);
map.add(layer3, 3);
// map.add(layer4, 4);

let activelayer = buildinglayer;

view.when(() => {
rendervalue(orgList);
searchContainer = document.getElementById("search");
// console.log(searchContainer); // Check if the element is being found
var searchFieldsString = ["URECD.URFloor2.FULL_NAME"];

if (searchContainer) {
sources = [
{
layer: buildinglayer,
searchFields: ["URECD.URFloor2.FULL_NAME"], // Fields to search within
displayField: "URECD.URFloor2.FULL_NAME", // Field to display in suggestions
exactMatch: false,
outFields: ["*"],
name: "Employee Location Search",
placeholder: "Search by Name",
getSuggestions: function (params) {
const suggestTerm = params.suggestTerm.toLowerCase();
const query = {
where: `LOWER(URECD.URFloor2.FULL_NAME) LIKE '%${suggestTerm}%'`,
outFields: "URECD.URFloor2.FULL_NAME",
returnGeometry: true,
f: "json"
};
return buildinglayer.queryFeatures(query).then(function (response) {
return response.features.map(function (feature) {
return {
text: feature.attributes["URECD.URFloor2.FULL_NAME"],
key: feature.attributes["URECD.URFloor2.FULL_NAME"],
sourceIndex: params.sourceIndex
};
});
});
},
getResults: function (params) {
const query = {
where: `URECD.URFloor2.FULL_NAME = '${params.suggestResult.text}'`,
outFields: ["*"],
returnGeometry: true,
f: "json"
};
return buildinglayer.queryFeatures(query).then(function (response) {
const features = response.features;
if (features.length > 0) {
view.popup.open({
features: features,
location: features[0].geometry.centroid
});
}
return features;
});
},
suggestionsEnabled: true, // Enable suggestions // Display both fields in suggestions
minCharacters: 3, // Minimum characters required to trigger suggestions
maxResults: 5, // Maximum number of suggestions to display
searchDelay: 500
}
];

searchWidget = new Search({
view: view, sources: sources, container: "search", locationEnabled: false, includeDefaultSources: false, zoomScale: null,
goToOverride: (view, goToOverrideParameters) => { // view.goTo({ target: goToOverrideParameters.target, zoom: 15 });
}
});//default search widget

// console.log(searchWidget); // Check if the search widget is being created
} else {
console.error("Search container element not found"); // Log an error if the element is not found
}
view.on("click", (event) => {
view.hitTest(event).then((response) => {
const results = response.results.filter((r) => r.graphic.layer === activelayer);
if (results.length > 0) {
const graphic = results[0].graphic;

if (graphic.attributes["URECD.Floor2BuilPlan_1.NETWORKID"] !== null && graphic.attributes["URECD.URFloor2.FULL_NAME"] !== null) {
buildinglayer.popupTemplate = template;
view.popup.open({
features: [graphic],
location: event.mapPoint
});
sendDataToDotNet(graphic.attributes);
}
else {
view.popupEnabled = false;
hidePopup();
}
//sendDataToDotNet(graphic.attributes);
}
else {
view.closePopup()
return;
}
});

});

//buildinglayer.popupTemplate = template;
view.on("pointer-move", async (event) => {
if (searchWidget.searchTerm) {
return;
}
const screenPoint = { x: event.x, y: event.y };
const hitTestResult = await view.hitTest(screenPoint, {
include: [buildinglayer]
});
const feature = hitTestResult.results.find(result => {
return result.graphic && result.graphic.layer === buildinglayer;
});

buildinglayer.popupTemplate = template;
if (feature) {
if (feature && feature.graphic.attributes["URECD.URFloor2.FULL_NAME"] !== null && feature.graphic.attributes["URECD.URFloor2.FULL_NAME"] !== "") {
view.popup.open({
features: [feature.graphic],
location: event.mapPoint,
featureMenuOpen: false // Optional: prevent context menu from opening
});
}
}
else {
view.closePopup()
}
});
});
await view.watch("updating", (updating) => {
if (!updating) {
// This function will execute once the map stops updating (is fully loaded/rendered)
console.log("Map is fully loaded and stationary.");
mapImage.style.display = "none";
loader.style.display = "none";
const viewDiv = document.getElementById("view-div");
if (viewDiv) {
viewDiv.style.opacity = 1;
} else {
console.error("view-div element was not found.");
// You can also add additional error handling or fallback behavior here
}
}
});
}

export async function filterMapfeatures(FloorNumber, divisionIds, groupIds, deptIds, FilteredorgList) {
rendervalue(FilteredorgList);
const orgList = JSON.parse(FilteredorgList);
DivisionIds = `'${divisionIds.join("','")}'`;
GroupIds = `'${groupIds.join("','")}'`;
DeptIds = deptIds;
const combinedIds = divisionIds.concat(groupIds);
const combineddeptIds = combinedIds.concat(DeptIds);
const combinedIdsString = `'${combineddeptIds.join("','")}'`;

if (DivisionIds != "" && DivisionIds.length > 0 && GroupIds != "" && GroupIds.length > 0) {
const query = {
where: "URECD.URFloor2.ORGN_CD NOT IN (" + combinedIdsString + ")",
returnGeometry: true,
outFields: ["*"]
};

const results = await buildinglayer.queryFeatures(query);
addGraphicsdata(results);
}
}

export async function CancelfilterMapfeatures(FloorNumber, divisionIds, groupIds, deptIds, FilteredorgList) {
rendervalue(FilteredorgList);
view.graphics.removeAll();
}
function addGraphicsdata(results) {
view.graphics.removeAll();
if (results.features.length > 0) {
let symbol;
switch (results.features[0].geometry.type) {
case "point": symbol = {
type: "simple-marker",
color: "#17CBE8",
size: 10,
}; break;
case "polygon": symbol = {
type: "simple-fill",
color: "#CFD8E6",
opacity: 0.7,
outline: {
color: [0, 255, 0, 1],
width: "0px"
}
};
}
var graphics = results.features.map((feature) => {
let graphic = new Graphic();
graphic.geometry = feature.geometry;
graphic.symbol = symbol;
return graphic;
});
view.graphics.addMany(graphics);
// view.goTo(graphics);
}
else {
// Clear the graphics in the layer if the query is empty
view.graphics.removeAll();
}

}

async function highlightOtherFeatures(results) {

const allFeaturesQuery = {
where: "1=1", // retrieve all features
returnGeometry: true,
outFields: ["*"]
};

let fieldname = "URECD.URFloor2.NETWORK_ID";
const allFeatures = await buildinglayer.queryFeatures(allFeaturesQuery);
//const resultFeatureIds = results.features.map(feature => feature.attributes.fieldname);
//const otherFeatures = allFeatures.features.filter(feature => !resultFeatureIds.includes(feature.attributes.fieldname));

const resultFeatureIds = results.features.map(feature => feature.attributes?.['URECD.URFloor2.NETWORK_ID']);
const otherFeatures = allFeatures.features.filter(feature => !resultFeatureIds.includes(feature.attributes?.['URECD.URFloor2.NETWORK_ID']));

if (otherFeatures.length > 0) {
let symbol;
switch (otherFeatures[0].geometry.type) {
case "point":
symbol = {
type: "simple-marker",
size: 10,
opacity: 0.2 // adjust the opacity
};
break;
case "polygon":
symbol = {
//type: "simple-fill",
//excludedEffect: "opacity(50%)",
///*opacity: 0.90 */// adjust the opacity
//outline: {
// color: [128, 128, 128, 0.5],
// width: "0px"
//}
};
}
var otherGraphics = otherFeatures.map((feature) => {
let graphic = new Graphic();
graphic.geometry = feature.geometry;
graphic.symbol = symbol;
return graphic;
});
view.graphics.addMany(otherGraphics);
}
}

export async function unselectMapFeatures(FloorNumber) {
view.graphics.removeAll();
// filterMapfeatures(FloorNumber, divisionIds, groupIds, FilteredorgList);
}

const outline = document.createElement("div");
outline.style.width = "10px";
outline.style.height = "10px";
outline.style.border = "3px solid " + department.ColorCode;
outline.style.marginLeft = "-3px";
li.appendChild(outline);

const label = document.createElement("label");
label.textContent = department.Name;
label.style.marginLeft = "7px";
li.appendChild(label);
ul.appendChild(li);

// Add groups
if (department.Groups) {
department.Groups.forEach(group => {
if (group.Ischecked) {
addGroupToLegend(group, ul);
}
});
}
// Add divisions
if (department.Divisions) {
department.Divisions.forEach(division => {
if (division.Ischecked) {
addDivisionToLegend(division, ul);
}
});
}
}
}
function addDivisionToLegend(division, ul) {
const li = document.createElement("li");
const canvas = document.createElement("canvas");
canvas.width = 10;
canvas.height = 10;
canvas.style.backgroundColor = division.ColorCode;
li.appendChild(canvas);

const label = document.createElement("label");
label.textContent = division.Name;
label.style.margin = "10px";
li.appendChild(label);
ul.appendChild(li);

if (division.GroupDetail) {
division.GroupDetail.forEach(group => {
if (group.Ischecked) {
addGroupToLegend(group, ul);
}
});
}
}
function addGroupToLegend(group, ul) {
const li = document.createElement("li");
const canvas = document.createElement("canvas");
canvas.width = 10;
canvas.height = 10;
canvas.style.backgroundColor = group.ColorCode;
canvas.style.borderRadius = "50%";
li.appendChild(canvas);

const label = document.createElement("label");
label.textContent = group.Name;
label.style.margin = "10px";
li.appendChild(label);
ul.appendChild(li);
}
//render unique value colors
async function rendervalue(orgList) {
try {
const query = {
where: "1=1",
outFields: ["*"],
returnGeometry: true
};
results = await buildinglayer.queryFeatures(query);
const uniqueValues = results.features.map((feature) => feature.attributes?.['URECD.URFloor2.COLOR_CODE']);
const uniqueValueSet = new Set(uniqueValues);
// console.log(uniqueValues);

renderer = {
type: "unique-value",
field: "URECD.URFloor2.COLOR_CODE",
defaultSymbol: {
type: "simple-fill",
color: "#CFD8E6",
outline: {
width: 0
}
},
defaultLabel: "Unknown",
uniqueValueInfos: []
};
uniqueValueSet.forEach((value) => {
const symbol = {
type: "simple-fill",
color: generateColor(value),
outline: {
width: 0
}
};
orgListjson = JSON.parse(orgList);
//const correspondingLabel = results.features.find((feature) => feature.attributes?.['URECD.URFloor2.COLOR_CODE'] === value).attributes?.['URECD.URFloor2.ORGN_NAME'];
const correspondingLabel = results.features.find((feature) => feature.attributes?.['URECD.URFloor2.COLOR_CODE'] === value).attributes?.['URECD.URFloor2.ORGN_NAME'];
const parentOrg = results.features.find((feature) => feature.attributes?.['URECD.URFloor2.COLOR_CODE'] === value).attributes?.['URECD.URFloor2.PARENT_ORG'];
renderer.uniqueValueInfos.push({
value: value,
symbol: symbol,
label: `${correspondingLabel}`,
parentOrg: parentOrg
});
});
renderer.orderByClassesEnabled = true;
buildinglayer.renderer = renderer;
customLegend(orgListjson);
} catch (error) {
console.error('Error querying features:', error);
}
}
function sendDataToDotNet(data) {

let city, Floornumber = '';
try { city = data['URECD.URFloor2.EMPLOYEE_A'].split('\r\n')[3]; } catch (e) { }

if (data['URECD.URFloor2.FLOOR_NUMB'] == null) { Floornumber = data['URECD.URFloor2.FLOOR_NUMB'] }
else { Floornumber = "" + data['URECD.URFloor2.FLOOR_NUMB'] }

let employeeDetail = {
Picture: data['URECD.Floor2BuilPlan_1.PICTURE'],
NetworkID: data['URECD.Floor2BuilPlan_1.NETWORKID'],
Name: data['URECD.URFloor2.FULL_NAME'],
Designation: toTitleCase(data['URECD.URFloor2.JOB_TITLE']),
Department: data['URECD.URFloor2.DEPARTMENT_NAME'],
DepartmentShortName: data['URECD.URFloor2.DEPARTMENT_SHORT_NAME'],
Unit: data['URECD.URFloor2.ORGN_NAME'],
unitShortName: data['URECD.URFloor2.ORGN_SHRT_NAME'],
City: city,
Building: data['URECD.URFloor2.BUIDLING'],
Floor: Floornumber,
Office: data['URECD.Floor2BuilPlan_1.LOCATION'],
}
let json = JSON.stringify(employeeDetail);

DotNet.invokeMethodAsync('URInsight2.Web.Client', 'SendArrayListToCSharp', json)
.then(data => {
console.log(data);
});

}
function toTitleCase(value) {
let values = value.split(' ');
let returnValue = "";
values.forEach(function (data, index) {
returnValue += capitalizeFirstLetter(data.toLowerCase()) + ' ';
});
return returnValue;
}
function capitalizeFirstLetter(str) {
return str.charAt(0).toUpperCase() + str.slice(1);
}

topic Re: Wep Map is not loading in ArcGIS for Power BI Questions

Wep Map is not loading

Re: Wep Map is not loading

Re: Wep Map is not loading

Re: Wep Map is not loading