POST
|
I found two work-arounds. The problem seems to be with the esriConfig module, specifically defining an API key within a React app. A key is required to use the premium set of basemaps which includes the one I'm using, "arcgis-light-gray". I have always defined my developer API key in my ArcGIS JS apps and I've done so in this React app as well. But this module appears to be broken in React. Either that or I need to reference the module differently than I currently am. If so, it's not covered in any documentation I could find. Work-around #1 - use a non-premium basemap like "gray" or "gray-vector". These basemaps lack the same level of detail at higher zoom levels, making this approach unacceptable if you want to zoom in to larger scales and see detail on individual parcels. Work-around #2 - uninstall @arcgis/core and install esri-loader instead. This set of modules appears to be the better way to use the ArcGIS JS API in React. With esri-loader the modules are imported with the loadModules function instead of require or import. After refactoring the app to use esri-loader I am now able to define my API key and the premium "arcgis-light-gray" basemap renders correctly. import logo from "./logo.svg";
import "./App.css";
import { loadModules } from "esri-loader";
function App() {
loadModules(['esri/config', 'esri/views/MapView', 'esri/Map']).then(([esriConfig, MapView, Map]) => {
esriConfig.apiKey = "REMOVED";
const map = new Map({
basemap: 'arcgis-light-gray'
});
const mapView = new MapView({
map: map,
zoom: 10,
center: [-82.5, 28],
container: "map-div"
});
});
return (
<div className="App">
<div id="map-div"></div>
</div>
);
}
export default App;
... View more
05-31-2022
05:30 AM
|
0
|
0
|
512
|
POST
|
I'm attempting to deploy a simple web app built with ArcGIS Javascript API v4.23. It's a React app that displays a single Map within a single MapView. The problem I'm having is that the basemap tiles don't render when the app is deployed as a Docker container. Has anyone else seen this? I can launch the app via localhost:3000 and everything works as expected. The map renders within the correct div and it shows the gray canvas basemap tiles. The CSS is also loading correctly and the zoom +/- buttons render correctly. All of this correct behavior happens when the app is launched locally. I can deploy it IIS or I can just run 'npm start' in VS Code and it runs without issues. This is how it displays: Code within the React app that creates the map and map view: import logo from './logo.svg';
import './App.css';
import { useEffect, useState, useRef } from "react";
import esriConfig from "@arcgis/core/config";
import Map from "@arcgis/core/Map";
import MapView from "@arcgis/core/views/MapView";
import FeatureLayer from "@arcgis/core/layers/FeatureLayer";
function App() {
const mapRef = useRef();
esriConfig.apiKey =
"removed";
const initMap = () => {
const map = new Map({
basemap: "arcgis-light-gray",
layers: []
});
const view = new MapView({
map: map,
center: [-82.354, 27.895],
zoom: 9,
container: mapRef.current,
});
};
useEffect(() => {
initMap();
}, []);
return (
<div className="App">
<div id="map-div" ref={mapRef}>
</div>
</div>
);
}
export default App; All of the above works when hosted locally or build and deployed to IIS. But the ultimate goal is to deploy this app within a Docker container. The image builds successfully and also runs successfully, but when I browse the app running inside the container the basemap tiles don't render. I get the same result in Chrome and Edge. There are no errors or exception thrown in the browser's console. It's as if the JS API is loading successfully but somehow the image tiles aren't rendering and I can't see any reason why this would fail only inside a Docker container. Dockerfile FROM node:latest as build
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
FROM nginx:latest
COPY ./nginx/default.conf /etc/nginx/conf.d/default.conf
COPY --from=build /app/build/ /usr/share/nginx/html/ .dockerignore file node_modules
Dockerfile
.git default.conf for NGINX server {
listen 80;
listen [::]:80;
root /usr/share/nginx/html;
index index.html index.htm index.nginx-debian.html;
server_name localhost;
location / {
try_files $uri $uri/ =404;
}
} I believe the problem has to have something to do with NGINX and how it is failing to handle the image tiles correctly, but that's just a half-baked theory. Update... I noticed some differences in the requests being made by each version of this app. In the network tab of Chrome's developer tools it looks like the app makes an extra call when running locally that is not made when it's running in a docker container. Locally it makes two calls to LightGray:Base and LightGray:Labels, and also World_Basemap_v2 further down. I see fewer calls for the light gray basemap resource in the Docker container and no request for World_Basemap_v2 at all. Any help is appreciated. Thanks.
... View more
05-23-2022
10:21 AM
|
0
|
1
|
635
|
POST
|
Out of curiosity I did a quick test with a different feature. I uploaded the exact same two files as attachments to a different feature and it works. Querying attachments on that feature returns both attachments. So....I went back to the original feature, deleted the attachment that is missing in the query responses, re-uploaded it, and now it works. Both attachments are returning in the query response for the original feature as well. I must have had a bad upload the first time. Next time I'll experiment with the actual file uploads a bit more before blaming my code.
... View more
02-02-2022
05:23 AM
|
0
|
0
|
675
|
POST
|
Thanks for the reply Jeff. I'm indexing the return by the oid 3 on purpose. The JSON structure is such that I should be getting an array of attachment objects as the value for the "3" property. Instead I only get one. I checked the dev console for a counter next to console.log but it's only logging once. It really seems like I'm only getting a single attachment in the response. For better visibility, I changed the code to log the entire attachmentsByObjectId object. // get all attachments for feature with objectId = 3
const oid = 3;
const attachmentsByObjectId = await layer.queryAttachments({
objectIds: [oid]
});
console.log(attachmentsByObjectId); Here is a screenshot of what's logged in the dev console in chrome: What I should be seeing is {3: Array(2)}
... View more
02-02-2022
05:16 AM
|
0
|
0
|
676
|
POST
|
I have a feature service with attachments and editing both enabled. Several features have multiple attachments. When I call the queryAttachments() method on this feature layer and pass in an objectId for a feature that has multiple attachments, I only get the first one in the returned data. This code snippet always returns only the first attachmentInfo but the feature has two attachments. Both attachments are visible in an ArcGIS Online web map that consumes this layer. They are also both visible in the data tab under Content. But again this code only returns the one. // get all attachments for feature with objectId = 3
const oid = 3;
const attachmentsByObjectId = await layer.queryAttachments({
objectIds: [oid]
});
if (attachmentsByObjectId && attachmentsByObjectId[oid] {
attachmentsByObjectId[oid].forEach(a => {
console.log(a);
});
}
Strangely, if I use Postman to query the exact same feature in the same feature service using the /queryAttachments endpoint, I get the correct number of attachments in the response data. Some info in this URL is obfuscated for privacy, but the rest call works perfectly. https://services.arcgis.com/<item>/arcgis/rest/services/<layerName>/FeatureServer/2/queryAttachments And the above call returns the correct data payload including both attachments: {
"fields": [
{
"name": "OBJECTID",
"type": "esriFieldTypeOID",
"alias": "OBJECTID",
"sqlType": "sqlTypeOther",
"domain": null,
"defaultValue": null
}
],
"attachmentGroups": [
{
"parentObjectId": 3,
"parentGlobalId": "",
"attachmentInfos": [
{
"id": 1,
"name": "test001.jpg",
"contentType": "image/jpeg",
"size": 3299047,
"keywords": "",
"exifInfo": null
},
{
"id": 2,
"name": "test002.jpg",
"contentType": "image/jpeg",
"size": 488852,
"keywords": "",
"exifInfo": null
}
]
}
]
} Is there a problem with my JS code, or is there some arbitrary limitation with the JS API where it will only return a single attachment per feature?
... View more
02-01-2022
03:13 PM
|
0
|
3
|
715
|
POST
|
This is the first time I've attempted to use IdentityManager. I have a basic web app built from scratch with the ArcGIS JS API v4.18. I need to display a feature layer that is hosted in ArcGIS Online and shared at the organization level. Because the layer is secured I assumed I would be prompting the user to provide credentials and then get a token. However, I came across this article about IdentityManager which states: To use the IdentityManager simply include esri/identity/IdentityManager as part of your require statement. Once the application runs and requests a resource that is secure, the IdentityManager takes over and handles prompting the user for the appropriate credentials. That sounds very convenient and simple so I added IdentityManager to the require statement, called the secured feature layer from ArcGIS Online, and added it to my map view's layers. The view and basemap load in the app, but a login never appears and the API seems to be aware that I'm trying to display a secured feature layer because I get the following errors in the console. The blurb I pasted above from ESRI's JS API documentation implies that calling the feature layer should have triggered IdentityManager to prompt the user for login, but it isn't doing that. No login form appears. What is the expected behavior here? Is there a better way to prompt the user for login and enable the app to consume the secured feature layer hosted in ArcGIS Online? Here's the full HTML and JS code for the app. It's just a single page. <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CAMS Viewer</title>
<link rel="stylesheet" href="http://js.arcgis.com/4.18/esri/themes/light/main.css">
<link rel="stylesheet" href="styles/style.css">
<link rel="stylesheet" href="styles/spin.css">
<link rel="shortcut icon" href="favicon.ico">
<script src="http://js.arcgis.com/4.18/"></script>
<script type="module">
import {config} from './scripts/config.js';
const legendDiv = document.getElementById("legend-panel-body");
require([
"esri/config",
"esri/Map",
"esri/identity/IdentityManager",
"esri/views/MapView",
"esri/widgets/BasemapGallery",
"esri/layers/FeatureLayer",
"esri/geometry/SpatialReference",
"esri/tasks/support/Query",
"esri/widgets/Search"
], function async(esriConfig, Map, esriId, MapView, BasemapGallery, FeatureLayer, SpatialReference, Query, Search) {
esriConfig.apiKey = config.arcgisApiKey;
const censusBlocksLayer = new FeatureLayer(config.censusBlocksUrl);
const map = new Map({
basemap: "arcgis-topographic", // Basemap layer service
layers: [censusBlocksLayer]
});
const view = new MapView({
map: map,
center: [-82.338, 27.927], // Longitude, latitude
zoom: 11, // Zoom level
container: "viewDiv", // Div element
});
// basemap gallery widget
const basemapGallery = new BasemapGallery({
view: view
});
view.ui.add(basemapGallery, {
position: "top-right"
});
// Search widget
var searchWidget = new Search({
view: view,
container: document.querySelector('#search-widget-wrapper')
});
});
</script>
</head>
<body>
<div id="header">
<div id="logo-container">
<img src="img/hc_logo_graybg.png"/>
</div>
<div id="header-title">
DEV
</div>
<div id="search-widget-wrapper"></div>
<div id="header-widget-menu">
<img src="img/basemap-24.png" class="widget-btn" data-toggle-selector=".esri-basemap-gallery"/>
</div>
</div>
<div id="main-container">
<div id="viewDiv"></div>
</div>
</body>
</html>
... View more
07-30-2021
09:27 AM
|
0
|
0
|
330
|
POST
|
We have a form built in Survey123 Connect with JavaScript that queries a map service and returns JSON. The JSON is parsed into several other fields. My question is, can we prevent the JSON field from being published? Currently the form is throwing an error because the JSON field isn't in the feature layer backing this survey. Frankly I don't want it to be. The only fields that should be in the hosted FL are those that are relevant to the ongoing data collection requirements. The JSON field is operational in nature and only exists as a staging ground for the JSON before it is parsed into other fields. Does Survey123 have a data type or setting that allows us to not just visibly hide, but prevent a field from being published into the feature layer?
... View more
07-22-2021
12:31 PM
|
0
|
3
|
1033
|
POST
|
That is a slick way to filter a list of choices that already exist. In my case, I would have to put 100's of thousands of choices into the spreadsheet to cover all the possibilities that are stored in the feature service. What I am looking to do is dynamically define the choices without having to store any predefined values in the excel choice tab.
... View more
07-12-2021
07:56 AM
|
0
|
2
|
1608
|
POST
|
Thanks Josh. Sorry I should have been more specific. What I want to do is define the choices for the dropdown dynamically. For example, in javascript I send the form's geopoint to the ArcGIS REST API, buffer the point 300ft and return all polygons from a feature service that intersect the buffer. Then I want to define the choices in a dropdown with the attribute values from the returned list of polygons. All of that already works except for the last part where the dropdown choices are defined. So far I haven't found any syntax to use in the excel form that will override the choices that are static in the choices tab.
... View more
07-12-2021
07:06 AM
|
0
|
4
|
1636
|
POST
|
We have several survey forms with individual fields that are populated with the results returned by custom javascript. We now have a need to populate a select_one dropdown with choices returned from a javascript function. Is this possible in the latest version of Survey123?
... View more
07-12-2021
06:33 AM
|
1
|
6
|
1643
|
POST
|
My task is to develop a customized version of the search widget that displays query results in the popup window instead of the default behavior which is to display the returned top address match. I've used this guide before to write queries in custom ArcGIS JS apps. When I reference the Query object in Widget.js of my customized search widget, I get this error in the console: GET https://js.arcgis.com/3.36/esri/tasks/support/Query.js net::ERR_ABORTED 404 I think this is happening because Query was in a different location pre v4 of the JS API. But it begs the question, why does web appbuilder have a dependency on ArcGIS JS API v3.36? We've been developing in v4+ for years.
... View more
05-26-2021
06:22 AM
|
0
|
1
|
500
|
POST
|
We are having problems trying to use the Push JSON to External Website output in a GeoEvent Service. Our GeoEvent Server instance is running v10.8 on Windows Server 2016. The geoevent service runs as expected and outputs json. I have confirmed this by attaching a second output, Write to a JSON file. The json itself is correct and complete. The external website we need to send the json to is actually hosted locally on the same server. Therefore I first configured the Push JSON output to call the external site at http://localhost:<port>/api This URL works in Postman and a web browser on the server, but the geoevent output doesn't work. I have also configured the output to use a fully qualified URL: http://<host>:<port>/api This url isn't working in geoevent server either, although it does work from Postman and a browser. GeoEvent server is configured to use our proxy server in site settings. Am I missing a step to get this Push JSON output to work?
... View more
03-17-2021
08:33 AM
|
0
|
1
|
579
|
POST
|
I wasn't able to find a processor included in GeoEvent Server that meets the following requirement. Hopefully there is a processor available for download that does. I have an input that polls a feature service. I need this geoevent to trigger an output that sends an email to about 900 recipients. All of the recipient email addresses are stored in a hosted feature layer. I was not able to use a geofence in this case because there is no spatial relationship between the new feature that triggers the geoevent and the feature layer that holds all of the recipients. So the scenario is simply this: Every time a new polygon is added to the input feature service, an email needs to be sent for every record in the feature layer that holds all the recipient data. Are there any processors or combinations of processors that can meet this need?
... View more
02-24-2021
09:12 AM
|
0
|
1
|
507
|
POST
|
The keyring approach sounded promising, but amazingly, the keyring.get_password method still returns the password as a string. It's good that I can call the password out of the Windows vault using this method, but again, it gets stored as a string and can be inspected, printed, whatever.
... View more
02-17-2021
11:05 AM
|
0
|
0
|
2765
|
POST
|
Thanks for the helpful replies. I think the keyring solution will probably work for me, as I can set it up locally and on the servers that will running these scripts.
... View more
02-17-2021
11:04 AM
|
0
|
0
|
1202
|
Title | Kudos | Posted |
---|---|---|
1 | 07-12-2021 06:33 AM | |
1 | 01-25-2021 10:04 AM | |
1 | 10-21-2020 07:10 AM |
Online Status |
Offline
|
Date Last Visited |
05-31-2022
07:43 AM
|