Nliu's TOC Widget, incoming URL parameter changes extent

TracySchloss — Sat, 11 Dec 2021 13:19:11 GMT

I have used this TOC widget for several years. This is the first time I've ever combined it with the functionality of accepting an incoming URL parameter as an argument. The user wants to be able to zoom to a particular ID number. The zoom works correctly. However, somewhere along the way the changing map extent is causing a problem. I often see errors related to the TOC.

The map extent is correct, and if you pan or zoom at all you see the map is centered correctly.

Occasionally the layer DOES draw, but it's sporadic. I have a very tight deadline (of course) and I'm up for rigging things around at this point, just to have all my layers draw every time. I'm not even sure its the TOC that's the problem.

My test site is public facing:

https://ogitest.oa.mo.gov/DNR/tmdl_imprdwater2/index.html?BUSINESSID=51215

This is how I'm checking to see if there is a URL parameter.

queryLayer.on('load', function(){
//expected input of layerid, fieldname, and layer number
myURLparameter.checkURL("queryLayer", "BUSINESSID", 5); //looks for id, zooms to water body with that ID if found
});

/*myURLparameter.js
* Tracy Schloss, Missouri Office of Geospatial Information
* Date:
* Description:
 */
define ([ 
 "dojo/on",
 "dojo/dom",
 "esri/urlUtils",
 "js/myFind"
], function ( on, dom, urlUtils,myFind
 ) { 
 return {
 checkURL: function(layerid, field, layerNum){ 
 var selectedVal = getIdFromUrl(document.location.href); 
 var selectLayer = app.map.getLayer(layerid);
 var urlPath = selectLayer.url;
 var urlLen = urlPath.length;
 var lastPos = urlPath.lastIndexOf("/");
 var findUrl = urlPath.substr(0, lastPos);
 if (selectedVal) {
 myFind.zoomSelect(findUrl,layerNum, field, selectedVal);
 }

 function getIdFromUrl(url){ //extract the county name from the url
 var urlObject = urlUtils.urlToObject(url);
 if (urlObject.query && urlObject.query.BUSINESSID) {//assumes incoming parameter of ?BUSINESSID='SOME##'
 return urlObject.query.BUSINESSID; //where the past element is a field name in the database
 }
 else {
 return null;
 }
 }
 }
 }
 });

‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

myFind.js

/*
* Tracy Schloss, Missouri Office of Geospatial Information
* Date:
* Description:
 */
define ([ 
 "dojo/on",
 "dojo/dom",
 "dojo/_base/lang",
 "esri/tasks/FindParameters",
 "esri/tasks/FindTask",
 "js/myWaterData"
], function ( on, dom,lang,FindParameters,FindTask,myWaterData
 ) { 
 return {
 zoomSelect: function(findUrl, layerNum, field, selectedVal){
 var wb_type;
 var findTask = new FindTask(findUrl);
 var findParams = new FindParameters();
 findParams.returnGeometry = true;
 findParams.layerIds = [layerNum];
 findParams.searchFields = [field]; //Fields are CASE SENSITIVE
 findParams.outSpatialReference = app.spatialReference;
 // var countyName = registry.byId("countySelect").value;//Set the search text to the value selected in the list 
 findParams.searchText = selectedVal;
 // findTask.execute(findParams, function(results){
 findTask.execute(findParams, lang.hitch(this, function(results) {
 if (results.length > 0) {
 app.map.setExtent(results[0].feature.geometry.getExtent().expand(1.5));
 findWaterAttributes(findUrl, selectedVal);
 }
 else {
 alert("ID not found in data");
 } 
 }));
 
 function findWaterAttributes(findUrl, selectedVal){
 var findTask = new FindTask(findUrl);
 var findParams = new FindParameters();
 findParams.returnGeometry = false;
 findParams.layerIds = [0, 1];
 findParams.searchFields = ["BUSINESSID"]; //Fields are CASE SENSITIVE
 findParams.searchText = selectedVal;
 // findTask.execute(findParams, function(results){
 findTask.execute(findParams, lang.hitch(this, function(results) { 
 var wbid = results[0].feature.attributes.WBID;
 if (wbid > 7000) {
 console.log("Lake found");
 myWaterData.createLakeList(results[0].feature);//sidebar to hold water body data
 }
 else {
 console.log("stream found") 
 myWaterData.createStreamList(results[0].feature);//sidebar to hold water body data
 } 
 }));
 }
 }
 }
 });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

myWaterData.js

/*
 * Tracy Schloss, Missouri Office of Geospatial Information
 * Date:
 * Description:
 */
define(["dojo/on", "dojo/dom", "dojo/_base/connect", "dijit/registry"], function(on, dom, connect, registry){
 return {
 // + "<br><b>:</b>"+ feature.attributes.
 createStreamList: function(feature){
 var streamTitle = feature.attributes.WB_NAME;
 var formatText = "<h3>" + streamTitle + "</h3>"+
 "<b>Business ID:</b>" + feature.attributes.BUSINESSID +
 "<br><b>Water Body ID: </b> " +
 feature.attributes.WBID +
 "<br><b>Year Impairment First Listed: </b>" +
 feature.attributes.YEAR_CD +
 "<br><b>Water Body Classification: </b>" +
 feature.attributes.WB_CLS +
 "<br><b>Size (miles): </b>" +
 feature.attributes.IMP_SIZE +
 "<br><b>Pollutant: </b>" +
 feature.attributes.POLLUTANT +
 "<br><b>EPA Category: </b>" +
 feature.attributes.CATEGORY +
 "<br><b>Source: </b>" +
 feature.attributes.SRC_DESC +
 "<br><b>Impaired Uses: </b>" +
 feature.attributes.IU +
 "<br><b>Other Uses: </b>" +
 feature.attributes.OU +
 "<br><b>Entire WB Impaired?: </b>" +
 feature.attributes.ENTIRE_WB +
 "<br><b>Upstream/Downstream County: </b>" +
 feature.attributes.COUNTY_U_D +
 "<br><b>Media Indicator: </b>" +
 feature.attributes.MEDIA_IND;
 
 // + "<br><b>Included in 303d Exports?: </b>"+ feature.attributes.IMPR_303D;
 
 dom.byId("dataDiv").innerHTML = formatText;
 },
 createLakeList: function(feature){
 var lakeTitle = feature.attributes.WB_NAME;
 var formatText = "<h3>" + lakeTitle + "</h3>"+
 "Business ID: </b>" + 
 feature.attributes.BUSINESSID +
 "<br><b>Water Body ID: </b> " +
 feature.attributes.WBID +
 "<br><b> Name: </b>" +
 feature.attributes.WB_NAME +
 "<br><b>Year Impairment First Listed: </b>" +
 feature.attributes.YEAR_CD +
 "<br><b>Water Body Classification: </b>" +
 feature.attributes.WB_CLS +
 "<br><b>Size (acres): </b>" +
 feature.attributes.IMP_SIZE +
 "<br><b>Pollutant: </b>" +
 feature.attributes.POLLUTANT +
 "<br><b>EPA Category: </b>" +
 feature.attributes.CATEGORY +
 "<br><b>Source: </b>" +
 feature.attributes.SRC_DESC +
 "<br><b>Impaired Uses: </b>" +
 feature.attributes.IU +
 "<br><b>Other Uses: </b>" +
 feature.attributes.OU +
 "<br><b>Entire WB Impaired?: </b>" +
 feature.attributes.ENTIRE_WB +
 "<br><b>Reach Code: </b>" +
 "<br><b>Media Indicator: </b>" +
 feature.attributes.MEDIA_IND;
 dom.byId("dataDiv").innerHTML = formatText;
 }
 }
});‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Nliu's TOC Widget, incoming URL parameter changes extent

KenBuja — Wed, 28 Jun 2017 13:00:19 GMT

Hi Tracy,

I have used the TOC widget with a URL parameter and haven't had any difficulties. Then again, the parameter isn't used to query the data, but to provide a configuration file for the site.

When the layer doesn't draw, I'm seeing lots of aborted queries in the network traffic (strangely, when looking at this in Firefox's Firebug, these don't appear in the console view until after you click the Net tab). These aborted queries are in several different layers of the ImparedWater2018 service: 0, 1, 2, and 5. There are also some aborted queries in the Basemap/county_simple service on layer 0

Re: Nliu's TOC Widget, incoming URL parameter changes extent

TracySchloss — Wed, 28 Jun 2017 13:30:15 GMT

It feels like the map isn't finishing loading/drawing initially before I change the map extent and it's crashing into itself. It's one of those situations where you put a breakpoint, and once you do, that's giving the display time to catch up. Is there a way to pause the display/refresh temporarily until after I've set the 2nd extent?

topic Re: Nliu's TOC Widget, incoming URL parameter changes extent in ArcGIS JavaScript Maps SDK Questions

Nliu's TOC Widget, incoming URL parameter changes extent

Re: Nliu's TOC Widget, incoming URL parameter changes extent

Re: Nliu's TOC Widget, incoming URL parameter changes extent