|
POST
|
Thanks Robert. The order of your variables seems the wrong way round, but it did the trick! I tried this order and it didn't change anything: map.addMany([attractions, boundary, rt66, canal, preserves]);
... View more
09-28-2018
10:54 AM
|
0
|
1
|
1916
|
|
POST
|
I'm working on an app with a few feature layers. There are points (attractions) and polygons (preserves). Why do the polygons overlap the points? Image: It doesn't seem to deal with the order of the feature layers in the <script>: //add attraction feature layer
var attractions = new FeatureLayer({
url: "https://services.arcgis.com/fGsbyIOAuxHnF97m/arcgis/rest/services/Attractions/FeatureServer/0?token=FRQ3ta_CoBnz3s5xOY8Q649k62CGCo1FxjRhLn9ptI2ANN03ld5Yma2vHGf8MbovDnGjE6VxpTJ7kAShDHjSAeJiuFhGiZVTT1yC6oogNPkfeKqroE1drY-84jmqnKHcEtgY_WjYeIa-RAftHdlO-OgqDvMQSwElQzVkI_GjsXViudg4DHApFmxlp3RoYngYH5kYH3qXcVSAU6Qhp-DgciW_ZvfWalpE1IJsB2b6eKO1bdGdPibKtQUJoGuqFbs_",
id: "attractions",
zoom: 2,
});
//add will county boundary
var boundary = new FeatureLayer({
url: "http://services.arcgis.com/fGsbyIOAuxHnF97m/arcgis/rest/services/Will_County_Boundary/FeatureServer/0?token=6vBDftNXDqbaZH6fbfhuDCeGkJFaWMSEPaeYDt6PbDBfVacnSMMD7PZS3QeCW6mDqgSFMK0tRjMyJyrxDPQ3rcjTNUCFpi0pfpU_mFLoKXGlT5FTGTPH3GjMqL9iQCqh9_ihX8D1-DQ5N_ptC-ic9bKeDLjqU2xQOv8wIRPjX5VwrtsQz_ltdanO49SVPaJ8F7EN6qWZMgvFw9V0iBbV4Iu0khjfjhuswBNzhjJa3I6q0epaze9AsPRVvVXJ5wik",
id: "boundary",
zoom: 1,
});
//add Rt 66
var rt66 = new FeatureLayer({
url: "https://services.arcgis.com/fGsbyIOAuxHnF97m/arcgis/rest/services/Will_County_Tourist_Attractions/FeatureServer/1?token=Bj40q7dvc09lhoMxvDc_YHICLyf8Sz-HYSQ-n4lP4f4CGm3JaITUY0Tm7FnhhXcDel7W4rzUoKt1jDqw5CZGaEAQgq3IfUGez171nOzq5UlHAX5xQqWiV5BC3eUbd02xjimDX7VzJh8Z6muNPIep3iy1uZKfURjQ-Pdi5bbuF1p2DtffTsnOYCpNsyRX8SraieLTqxpm-2L6TdzRrUt2B6V48kzXcrQQz6uGDiUrBycc0GL0K94QiUmKwJNUxDXB",
id: "rt66",
zoom: 1,
});
//add Canal
var canal = new FeatureLayer({
url: "https://services.arcgis.com/fGsbyIOAuxHnF97m/arcgis/rest/services/Will_County_Tourist_Attractions/FeatureServer/7?token=hhHLfbTFMO4xFbknwKCPflTqPD9RL5itP3d986PoOep4vUpYx5a27DnJ2PlFrPNXbkh_ytENT0SON4tQmlnxh7kiIqS10xkmfylm7IjTE9g5zah3TAe3XNEV6PxrN2jyU42SX0CF-7EABZGhODoFvu9K8wMQnAH5-2iJ26SmD68z2De_aXWT8EOjwAt6jBPV_BF9P031hxa8ei_rYDM126rHh_B7lPwoD8WjuVTp67qZyo3EdCKcuv1fsKG7g70M",
id: "canal",
});
//add FPDWC preservs
var preserves = new FeatureLayer({
url: "https://services.arcgis.com/fGsbyIOAuxHnF97m/arcgis/rest/services/Will_County_Tourist_Attractions/FeatureServer/2?token=iVy9SWuGGAelNxz-bZrVvaE5FG3S_FfugVidwyINuh_XgsPUhM_W_XO3f75zJDIN2J2f6D0b7fMbjd2zl08NAghPxjZiD4RZGapZajL_nNMp2xoCxB77LDk201BkOMwnEmOIv10EexpqjR_rV713GK7Jw19qB4SkKkWj6sKBOM0bKxo78fc6znY--QIvtegGrigwViKjxyIB17sGxXswV62xOKkYpX96s37oGaKqRNX7EzG4IUmTXA8mQfb9W4S4",
id: "preserves",
});
//functions
map.add(featureLayer);
map.add(attractions);
map.add(boundary);
map.add(rt66);
map.add(canal);
map.add(preserves);
});
</script> I suspect it has to do with the hosted feature layers back in AOL. The attractions feature layer was created from a CSV file, while the other feature layers were uploaded to AOL in a FGDB.
... View more
09-28-2018
09:58 AM
|
1
|
3
|
2124
|
|
POST
|
Brilliant. Thanks Robert. BTW, I also had to change this section to false or else I was getting the attributes to show up in the popup too. {
fieldName: "Photo",
label: "Photo",
visible: false,
}
... View more
09-21-2018
01:14 PM
|
0
|
0
|
4908
|
|
POST
|
In my attributes the Photo field is a URL: http://www.willcogis.org/website2014/gis/images/mar.png So, I thought I'd change the type to "url" instead of "image" under mediaInfos. Nothing.
... View more
09-21-2018
11:34 AM
|
0
|
2
|
4908
|
|
POST
|
Adrian, That segment is actually where I got the idea. My code has the chart section partially incorporated (using an image). But, I can't get the image to show up in the popup. For one, I'm not sure what the tooltipField variable is or why they include it? Here's how I incorporated it: var view = new MapView({
container: "viewDiv",
map: map,
scale: 500000,
center: [-87.95, 41.4],
popup: {
dockEnabled: true,
dockOptions: {
//disables the dock button from the pop-up
buttonEnabled: false,
//ignore the default sizes that trigger responsive docking
breakpoint: false,
}
}
});
//popup template
var template = { //autocasts the new template
title: "<font color= '#008000'>{Name}",
content: [{ //set content elements in the order to display
type: "fields",
fieldInfos: [{
fieldName: "Type",
label: "Type",
visible: true,
}, {
fieldName: "Address",
label: "Address",
visible: true,
}, {
fieldName: "Website",
label: "Website",
visible: true,
}, {
fieldName: "Photo",
label: "Photo",
visible: true,
},
]
}, {
// You can set a media element within the popup as well. This
// can be either an image or a chart. You specify this within
// the mediaInfos. Similar to text elements, media can only be set within the content.
type: "media",
mediaInfos: [{
type: "image",
value: {
fields: ["Photo"],
normalizeField: null,
}
}]
}
]
};
... View more
09-21-2018
10:54 AM
|
1
|
3
|
4908
|
|
POST
|
This webpage I'm working on is in a test phase. I have one point on the map. There's a table behind it with the name, type, address, website and photo. I would like to have the photo show up in the popup. Right now, when you click the point the photo field shows up in the popup as a link. That's not what I'm going for. I want this and each additional point I add to show the photo of its related field directly in the popup. Here's a sample that does something similar: ArcGIS API for JavaScript Sandbox. Each popup has it's related chart coming from their table. This is what I want to do. The pics here don't change.
... View more
09-21-2018
09:34 AM
|
1
|
5
|
5195
|
|
POST
|
Thanks to you both. I just realized at the same time it was the the header in the CSS that was causing the problem. I'll have to adjust this.
... View more
09-19-2018
12:44 PM
|
0
|
0
|
2843
|
|
POST
|
Robert, I can't see anything in the CSS that would be related to the popup. Here's a link to the webpage in case you'd like to check it out. It's all one big HTML file. I've tried undocking it, but the title is still centered. I've tried it without the graphic used to outline the feature layer, but no difference. I haven't taken out all elements related to the popup and started over. I might have to, however.
... View more
09-19-2018
12:15 PM
|
0
|
3
|
2843
|
|
POST
|
The title in the popup is currently centered. Is there a way I can get this to be left aligned? The popup is docked. And there's nowhere in the CSS section to style it? var view = new MapView({
container: "viewDiv",
map: map,
scale: 700000,
center: [-87.85, 41.5],
popup: {
dockEnabled: true,
dockOptions: {
// Disables the dock button from the popup
buttonEnabled: false,
// Ignore the default sizes that trigger responsive docking
breakpoint: false,
top,
}
}
});
... View more
09-18-2018
01:20 PM
|
0
|
5
|
3010
|
|
POST
|
Robert, Sorry, I should have mentioned I'm building a custom app. Ok, so the code in WAB page won't work. I'm looking for a way to display a small paragraph about the app when the user first opens the page. I thought a splash screen could work nicely. I also tried a window alert, but I don't like the look: Tryit Editor v3.5 In this question on Geonet someone asks a similar question, but the answers refer to outside sources: https://community.esri.com/thread/202969-splash-screen-with-the-arcgis-js-api-4x Is there not a way using ArcGIS for JS?
... View more
08-24-2018
11:53 AM
|
0
|
4
|
3342
|
|
POST
|
There's this, but they don't tell you where it goes: Splash—Web AppBuilder for ArcGIS (Developer Edition) | ArcGIS for Developers And there's nothing on ArcGIS API for JavaScript 4.8 sample code page: Samples Overview | ArcGIS API for JavaScript 4.8
... View more
08-24-2018
11:18 AM
|
0
|
6
|
4208
|
|
POST
|
Robert, You're able to see the entire popup? Maybe it's a phone version issue then? On my Android 3G smart phone I'm only getting the upper left corner of the popup. It's on the bottom right side, but most of it is off the screen. This is the problem I'm having. And so, I was asking if there were other ways to dock it? EDIT: I just did a Google Chrome (browser I use on my phone) update and now the popup seems to dock pretty decently on the bottom, as you said yours did. I also changed the breakpoint to true. However, it didn't actually do what it was supposed to on the phone, which to my understanding is to undock it. popup: {
dockEnabled: true,
dockOptions: {
// Disables the dock button from the popup
buttonEnabled: false,
// Ignore the default sizes that trigger responsive docking
breakpoint: true,
}}
... View more
08-21-2018
09:18 AM
|
0
|
1
|
2329
|
|
POST
|
Hello, I'm building my first app using snippets. I need help adjusting a popup so that it appears correctly on a mobile device. As of now the app looks good on a PC, but on my smart phone the popup is almost completely off the screen. EDIT: My intention is to have a docked popup in the top right corner. When viewing the app on a PC that's where it is, so that's good. So far, I had a look at this sample code. But, I didn't get anything out of it. Popup dock positions | ArcGIS API for JavaScript 4.8 Here's my code: <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Intro to Popups</title>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<link rel="stylesheet" href="http://js.arcgis.com/4.8/esri/css/main.css">
<script src="http://js.arcgis.com/4.8/"></script>
<script>
require([
"esri/Map",
"esri/views/MapView",
"esri/layers/FeatureLayer", //Require the FeatureLayer module
"esri/Graphic",
"dojo/dom",
"dojo/on",
"dojo/domReady!"
],
function(
Map, MapView, FeatureLayer, Graphic, dom, on
) {
var warming = new FeatureLayer({
url: "https://services.arcgis.com/fGsbyIOAuxHnF97m/arcgis/rest/services/Warming_Centers_in_and_around_Will_County_IL/FeatureServer/0?token=D_nuNBIqs-eSw-9SGAdtGHxOVGD9pC8U4gGOmwpkyvPxwvwCO3eiuSxaK4gbuO6x5aDZil_xW_iObpWePfHpIO_Vf-Rj2J7B_XnG95zynEqa0iuT0KE_OwujjdUMszM3raRq0zW9WskdokSXWHn8tJGb55fPni3coDnntG0lTOi9u5mfWf4mLRIfLBshuC2vXCiNLVzicWbH39jCFokDiqDjt8YfOdfyasL4ljvNftkl9Jpkr-7OJNElSp2yY9SG",
id: "warming",
minScale: 5000000
});
var boundary = new FeatureLayer({
url: "http://services.arcgis.com/fGsbyIOAuxHnF97m/arcgis/rest/services/Will_County_Boundary/FeatureServer/0?token=6vBDftNXDqbaZH6fbfhuDCeGkJFaWMSEPaeYDt6PbDBfVacnSMMD7PZS3QeCW6mDqgSFMK0tRjMyJyrxDPQ3rcjTNUCFpi0pfpU_mFLoKXGlT5FTGTPH3GjMqL9iQCqh9_ihX8D1-DQ5N_ptC-ic9bKeDLjqU2xQOv8wIRPjX5VwrtsQz_ltdanO49SVPaJ8F7EN6qWZMgvFw9V0iBbV4Iu0khjfjhuswBNzhjJa3I6q0epaze9AsPRVvVXJ5wik",
id: "boundary",
zoom: 1,
});
var map = new Map({
basemap: "streets-night-vector",
layers: [warming, boundary]
});
var view = new MapView({
container: "viewDiv",
map: map,
scale: 1000000,
center: [-88, 41.5],
popup: {
dockEnabled: true,
dockOptions: {
// Disables the dock button from the popup
buttonEnabled: false,
// Ignore the default sizes that trigger responsive docking
breakpoint: false,
}}
});
var template = { // autocasts as new PopupTemplate()
title: "{FACILITY_NAME}",
content: [{
type: "fields",
fieldInfos: [{
fieldName: "FACILITY_TYPE",
label: "Facility Type",
visible: true,
}, {
fieldName: "ADDRESS",
label: "Address",
visible: true,
}, {
fieldName: "WEBSITE",
label: "Website",
visible: true,
}, {
fieldName: "PHONE_NUMBER",
label: "Phone",
visible: true,
}, {
fieldName: "HOURS",
label: "Hours",
visible: true,
}]
}]
};
var featureLayer = new FeatureLayer({
url: "https://services.arcgis.com/fGsbyIOAuxHnF97m/arcgis/rest/services/Warming_Centers_in_and_around_Will_County_IL/FeatureServer/0?token=D_nuNBIqs-eSw-9SGAdtGHxOVGD9pC8U4gGOmwpkyvPxwvwCO3eiuSxaK4gbuO6x5aDZil_xW_iObpWePfHpIO_Vf-Rj2J7B_XnG95zynEqa0iuT0KE_OwujjdUMszM3raRq0zW9WskdokSXWHn8tJGb55fPni3coDnntG0lTOi9u5mfWf4mLRIfLBshuC2vXCiNLVzicWbH39jCFokDiqDjt8YfOdfyasL4ljvNftkl9Jpkr-7OJNElSp2yY9SG",
outFields: ["*"],
popupTemplate: template
});
map.add(featureLayer);
view.popup.watch("selectedFeature", function(e) {
view.graphics.removeAll();
if (e && e.geometry) {
view.graphics.add(new Graphic({
geometry: e.geometry,
symbol: {
type: "simple-marker",
style: "circle",
size: 12,
outline: {
color: "#a900e6",
width: 2
}
}
}));
}
});
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</span>
</body>
</html>
... View more
08-20-2018
01:10 PM
|
0
|
3
|
2839
|
| Title | Kudos | Posted |
|---|---|---|
| 1 | 06-25-2026 12:25 PM | |
| 1 | 05-04-2026 08:45 AM | |
| 1 | 04-20-2026 01:20 PM | |
| 1 | 07-24-2025 01:27 PM | |
| 1 | 11-13-2025 08:22 AM |
| Online Status |
Offline
|
| Date Last Visited |
10 hours ago
|