|
POST
|
If I am understanding you correctly, look into Arcade: Arcade | ArcGIS API for JavaScript 4.12 Here is a sample using arcade for popups: Reference Arcade expressions in PopupTemplate | ArcGIS API for JavaScript 4.12
... View more
08-09-2019
03:43 PM
|
0
|
1
|
1469
|
|
POST
|
Try this var swipeWidget = new LayerSwipe({
type: "vertical",
map: currentMap,
layers: [newLayer]
}, currentMap.swipeWidgetID);
swipeWidget.startup(); delete this var layerIds = currentMap.layerIds;
console.log(layerIds); //["layer0", "CouncilDistricts", "Fragmentation", "layer1"]
var layer = layerIds[2];
console.log(layer); //Fragmentation
var wholeLayer = currentMap.getLayer(layer);
console.log(wholeLayer); // the whole ArcGISDynamicMapServiceLayer with 1 visible layer
And no problem, glad to help.
... View more
08-07-2019
02:26 PM
|
0
|
1
|
2111
|
|
POST
|
In the example, they are just using layerId to get the layers var swipeLayer = map.getLayer(id); So try defining the layer like below instead of using the layer Ids var layer = new ArcGISDynamicMapServiceLayer("https://gis.davey.com/arcgis/rest/services/BloomingtonIN/BloomintonIN/MapServer");
var swipeWidget = new LayerSwipe ({
type: "vertical",
map: currentMap,
layers: [layer]
}, "swipeWidgetId");
swipeWidget.startup();
... View more
08-07-2019
12:51 PM
|
1
|
0
|
2111
|
|
POST
|
This may work: let set = new Set();
Object.keys(spcAtISitesCommon).forEach((key)=> {
set.add(spcAtISitesCommon[key].species_common)
});
Object.keys(spcAtObsCommon).forEach((key)=> {
set.add(spcAtObsCommon[key].species_common)
}); A set is essentially a unique array. We are iterating through the objects and adding each species to the set. Edit: my understanding being that the data is structured like: const spcAtObsCommon= {
0: {species_common: "Black Kite"},
1: {species_common: "White Stork"}
}
... View more
08-07-2019
08:52 AM
|
1
|
0
|
2756
|
|
POST
|
You can use a Popup Template: PopupTemplate | ArcGIS API for JavaScript 4.12 To specify a date format: FieldInfoFormat | ArcGIS API for JavaScript 4.12 Here is an example of how to create and use a popup template: ArcGIS API for JavaScript Sandbox
... View more
08-07-2019
08:13 AM
|
0
|
0
|
1980
|
|
POST
|
You can add the layer like this: require(["esri/layers/DynamicMapServiceLayer"], function(DynamicMapServiceLayer) {
//...
var layer = new ArcGISDynamicMapServiceLayer("https://gis.davey.com/arcgis/rest/services/BloomingtonIN/BloomintonIN/MapServer");
map.addLayer(layer);
//...
});
... View more
08-07-2019
07:59 AM
|
2
|
0
|
2111
|
|
POST
|
Did you include the module in the require and function arguments? require(["esri/dijit/LayerSwipe"], function(LayerSwipe) { /* code goes here */ });
... View more
08-06-2019
02:52 PM
|
2
|
0
|
2111
|
|
POST
|
This worked for me <html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
<title>MISIN Treatment Tracker: Print</title>
<link rel="stylesheet" href="https://js.arcgis.com/3.29/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="https://js.arcgis.com/3.29/esri/css/esri.css">
<!--js scripts to print map-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/javascript-canvas-to-blob/3.15.0/js/canvas-to-blob.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.8/FileSaver.js"></script>
<!--end print scripts-->
<style>
@media print {
#printButton {
display: none;
}
}
</style>
<!-- START ESRI MAP SCRIPT -->
<script>var dojoConfig = { parseOnLoad: true }</script>
<script src="https://js.arcgis.com/3.29/"></script>
<script>
var theMap;
var cred = "esri_jsapi_id_manager_data";
var symbol, infoTemplate;
var OID;
require([
"esri/map",
"esri/SpatialReference",
"esri/layers/ArcGISTiledMapServiceLayer",
"esri/layers/ArcGISDynamicMapServiceLayer",
"esri/layers/FeatureLayer",
"esri/layers/ImageParameters",
"esri/symbols/SimpleMarkerSymbol",
"esri/symbols/SimpleLineSymbol",
"esri/symbols/SimpleFillSymbol",
"esri/layers/LayerDrawingOptions",
"esri/layers/LabelLayer",
"esri/layers/LabelClass",
"esri/symbols/TextSymbol",
"esri/renderers/SimpleRenderer",
"esri/graphic",
"esri/InfoTemplate",
"esri/urlUtils",
"esri/arcgis/utils",
"esri/graphicsUtils",
"esri/dijit/Legend",
"esri/dijit/Scalebar",
"esri/dijit/Print",
"esri/tasks/query",
"esri/tasks/QueryTask",
"esri/tasks/PrintTask",
"esri/tasks/PrintParameters",
"esri/tasks/PrintTemplate",
"esri/request",
"esri/config",
"esri/geometry/Extent",
"esri/IdentityManager",
"esri/lang",
"dojo/_base/array",
"dojo/_base/Color",
"dojo/_base/unload",
"dojo/cookie",
"dojo/json",
//"dojo/_base/json",
"dojo/parser",
"dojo/dom-construct",
"dojo/dom-class",
"dojo/dom",
"dojo/on",
"dijit/layout/BorderContainer",
"dijit/layout/ContentPane",
"dijit/form/Button",
"dojo/domReady!",
], function(
Map,
//MapView,
SpatialReference,
ArcGISTiledMapServiceLayer,
ArcGISDynamicMapServiceLayer,
FeatureLayer,
ImageParameters,
SimpleMarkerSymbol,
SimpleLineSymbol,
SimpleFillSymbol,
LayerDrawingOptions,
LabelLayer,
LabelClass,
TextSymbol,
SimpleRenderer,
Graphic,
InfoTemplate,
urlUtils,
arcgisUtils,
graphicsUtils,
Legend,
Scalebar,
Print,
Query,
QueryTask,
PrintTask,
PrintParameters,
PrintTemplate,
esriRequest,
esriConfig,
Extent,
esriId,
esriLang,
arrayUtils,
Color,
baseUnload,
cookie,
JSON,
parser,
domConstruct,
domClass,
dom,
on,
BorderContainer,
ContentPane,
Button
){
function init()
{
// store credentials/serverInfos before the page unloads
baseUnload.addOnUnload(storeCredentials);
// look for credentials in local storage
loadCredentials();
//parser.parse();
esriConfig.defaults.io.proxyUrl = "/proxy/";
// START OF ESRI WEBMAP CREATION
//create the map
theMap = new Map("mapdiv", {
basemap:"topo",
showLabels: true,
});
//Disable Map Navigation
theMap.on("load", function() {
theMap.disableMapNavigation();
theMap.hideZoomSlider();
});
// print dijit
var printer = new Print({
map: theMap,
url: "https://utility.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task"
}, dom.byId("printButton"));
printer.startup();
// Create labels for the National Wetlands Inventory Layer
var labelField = "WETLAND_TYPE"
var wetlandsColor = new Color ("#0E881B");
var wetlandsLine = new SimpleLineSymbol("solid", wetlandsColor, 1.5);
var wetlandsRenderer = new SimpleRenderer(wetlandsLine);
var wetlandsLabel = new TextSymbol().setColor(wetlandsColor);
wetlandsLabel.font.setSize("10pt");
wetlandsLabel.font.setFamily("arial");
var json = {
"labelExpressionInfo": {"value": "{WETLAND_TYPE}"}
};
//create instance of LabelClass (note: multiple LabelClasses can also be passed in as an array)
var labelClass = new LabelClass(json);
labelClass.symbol = wetlandsLabel;
//Add National Wetlands Inventory
var wetlands = new FeatureLayer("https://gisago.mcgi.state.mi.us/arcgis/rest/services/OpenData/hydro/MapServer/18");
wetlands.setRenderer(wetlandsRenderer)
wetlands.setLabelingInfo([ labelClass ]);
theMap.addLayer(wetlands);
//Use the ImageParameters to set map service layer definitions and map service visible layers before adding to the client map.
var imageParameters = new ImageParameters();
//only certain layers to be visible. This can only be done with a dynamic map service and it does impact performance. Cached map services are recommended.
imageParameters.layerIds = [2];
imageParameters.layerOption = ImageParameters.LAYER_OPTION_SHOW;
imageParameters.transparent = true;
//construct ArcGISDynamicMapServiceLayer with imageParameters from above
var dynamicMapServiceLayer = new ArcGISDynamicMapServiceLayer("https://fuzzy.asets.msu.edu/arcgis/rest/services/MISIN/misin_treatments/MapServer",
{"opacity": 0.0},
{"imageParameters": imageParameters});
theMap.addLayer(dynamicMapServiceLayer);
//build query task
var queryTask = new QueryTask("https://fuzzy.asets.msu.edu/arcgis/rest/services/MISIN/misin_treatments/MapServer/2");
//build query filter
var query = new Query();
query.returnGeometry = true;
query.outFields = ["*"];
//create symbol for selected features
symbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,
new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
new dojo.Color([64,124,248]), 2),new dojo.Color([189,209,253]));
//pass the url parameters.
var urlObject = urlUtils.urlToObject(window.location.href);
if (urlObject.query)
{
if (urlObject.query.id)
{ OID = urlObject.query.id; }
//set query based on the parameters
var treatmentid = "OBJECTID = '" + OID + "'";
query.where = treatmentid;
//execute query and call showResults on completion
//queryTask.execute(query,showResults);
}
//Execute task and call showResults on completion
queryTask.execute(query, showResults);
}
function showResults(featureSet)
{
//remove all graphics on the maps graphics layer
theMap.graphics.clear();
theMap.infoWindow.hide();
//QueryTask returns a featureSet. Loop through features in the featureSet and add them to the map.
//Performance enhancer - assign featureSet array to a single variable.
var resultFeatures = featureSet.features;
for (var i=0, il=resultFeatures.length; i<il; i++)
{
//Get the current feature from the featureSet. Feature is a graphic
var graphic = resultFeatures[i];
graphic.setSymbol(symbol);
//Set the infoTemplate.
graphic.setInfoTemplate(infoTemplate);
//Add graphic to the map graphics layer.
theMap.graphics.add(graphic);
}
//Zoom to the extent of the graphics
var myFeatureExtent = esri.graphicsExtent(resultFeatures);
theMap.setExtent(myFeatureExtent.getExtent().expand(3));
//Refresh the URL with the currently selected parcel
window.history.pushState(null,null,"?id=" + graphic.attributes.OBJECTID);
}
// END OF ESRI MAP CREATION
// STORE CREDENTIALS
function loadCredentials(){
var idJson, idObject;
if (supports_local_storage()) {
// read from local storage
idJson = window.localStorage.getItem(cred);
}
else {
// read from a cookie
idJson = cookie(cred);
}
if (idJson && idJson != "null" && idJson.length > 4) {
idObject = JSON.parse(idJson);
esriId.initialize(idObject);
}
else {
// console.log("didn't find anything to load :(");
}
}
function storeCredentials(){
// make sure there are some credentials to persist
if (esriId.credentials.length === 0) {
return;
}
// serialize the ID manager state to a string
var idString = JSON.stringify(esriId.toJson());
// store it client side
if (supports_local_storage()) {
// use local storage
window.localStorage.setItem(cred, idString);
// console.log("wrote to local storage");
}
else {
// use a cookie
cookie(cred, idString, {expires: 1});
// console.log("wrote a cookie :-/");
}
}
function supports_local_storage(){
try {
return "localStorage" in window && window["localStorage"] !== null;
} catch (e) {
return false;
}
}
// END OF CREDENTIALS
dojo.addOnLoad(init);
});
</script>
</head>
<!-- START OF PAGE LAYOUT -->
<body class="claro">
<div id="printButton"></div>
<!--<input type="button" id="printButton" value="Print" onclick="print()">-->
<div id="content" dojotype="dijit.layout.BorderContainer" design="headline" gutters="true" style="width: 800px; height: 800px; margin: 0;">
<div id="mapdiv" dojotype="dijit.layout.ContentPane" region="center" style="overflow:hidden;"></div>
</div>
</body>
<!-- END OF PAGE LAYOUT -->
</html>
... View more
08-06-2019
02:12 PM
|
1
|
2
|
5576
|
|
POST
|
In this example they are just creating an 'app' object to organize the different parts of their code. It is not necessary, however if you remove the 'app' declaration you would also need to remove it throughout the rest of the code. In terms of the url, we do not recommend using sampleserver6 in production. The server is used for testing and is not reliable. I would use this one: https://utility.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task So the new snippet would be: // print dijit
var printer = new Print({
map: map,
url: "https://utility.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task"
}, dom.byId("printButton"));
printer.startup(); In terms of the proxy, it should work without one. If you have any other questions let me know. Posting your code would be helpful if that is an option for you.
... View more
08-06-2019
01:04 PM
|
1
|
5
|
5576
|
|
POST
|
If you have a specific question or if there is part of the sample that is confusing to you I can try to help.
... View more
08-06-2019
12:32 PM
|
0
|
7
|
5576
|
|
POST
|
Hi Claire, Take a look at this sample using the print widget: Print | ArcGIS API for JavaScript 3.29 The documentation is here: Print | API Reference | ArcGIS API for JavaScript 3.29
... View more
08-06-2019
12:20 PM
|
0
|
9
|
5576
|
|
POST
|
I can repro. Also an issue in 4.11. Does this happen when the webmaps are all different?
... View more
08-06-2019
10:18 AM
|
0
|
1
|
909
|
|
POST
|
I'd also like to give a quick shout out to D3 If you really want to jazz it up you can use transition easing: https://bl.ocks.org/d3noob/1ea51d03775b9650e8dfd03474e202fe Edit: This wouldn't help in your case I'm just a fan of their animations
... View more
08-06-2019
09:46 AM
|
0
|
0
|
2388
|
|
POST
|
I agree with Robert ES6+ is important. Look into arrow functions and let/const vs var. Something else to mention would be using forEach or map to loop through things such as graphics will be very useful. The API relies heavily on promises, so that is important to understand as well. As Noah said, the JavaScript API itself is written using TypeScript. Understanding the underlying typing and inheritance of the API will be profoundly helpful. Something that I see a lot of people misunderstand is the difference between geometries and graphics, as well issues with sub-classes of geometries. By using TypeScript and consciously defining variable types you will learn the API much quicker.
... View more
08-05-2019
03:50 PM
|
3
|
0
|
3467
|
|
POST
|
Try something like this: function createExtentGraphic(amenityGraphicsLayer){
const graphics = amenityGraphicsLayer.graphics;
graphics.forEach(function (g) {
var graphicClone = new Graphic();
graphicClone = g.clone();
extentGraphics.add(graphicClone);
}
} Note I wrote this directly into the forum so there may be some syntax errors
... View more
08-05-2019
11:22 AM
|
2
|
1
|
2573
|
| Title | Kudos | Posted |
|---|---|---|
| 1 | 12-22-2021 10:22 AM | |
| 1 | 01-19-2023 11:10 AM | |
| 1 | 08-30-2022 04:09 PM | |
| 2 | 08-22-2022 03:20 PM | |
| 1 | 08-22-2022 03:57 PM |
| Online Status |
Offline
|
| Date Last Visited |
02-03-2023
03:22 AM
|