Customized Layer Toggle Not Passing Layer Name

349
23
03-05-2019 07:42 AM
joerodmey
MVP Regular Contributor

I've customized Robert's layer toggle widget to look at which layer is currently on and pass this into a popup link that I have. All of my layers follow the same naming scheme of "layername_Main" or "layername_Mezz". The code looks for the underscore symbol as the flag and then applies the main or mezz label to be passed into my link to Survey123.

I have all of this done in MapManager.js in the publishMapEvent function (included below)

Sometimes this works, other times it doesn't. Right now the toggle switches between the layers (from main to mezz) and the link updates properly. But when I toggle back to main, it stays at mezz label even though the layer changes back to main. I want the label to keep up with the toggle. 

Any ideas?

Thanks

_publishMapEvent: function(map) {


topic.subscribe('toggleChanged', lang.hitch(this, function(visible, layer){
if(visible && layer.title=='layername_Main'||layer.title=='layername_Mezz'){
this.SERVICE_ID = layer.title;
}
}));



// create node for the tooltip
var tip = "Click on problem location";
var tooltip = dojo.create("div", { "class": "tooltip", "innerHTML": tip, "style": "color: red; font-size:22px;width:200px"}, map.container);
dojo.style(tooltip, "position", "fixed");

// update the tooltip as the mouse moves over the map
dojo.connect(map, "onMouseMove", function(evt) {
var px, py;
if (evt.clientX || evt.pageY) {
px = evt.clientX;
py = evt.clientY;
} else {
px = evt.clientX + dojo.body().scrollLeft - dojo.body().clientLeft;
py = evt.clientY + dojo.body().scrollTop - dojo.body().clientTop;
}

// dojo.style(tooltip, "display", "none");
tooltip.style.display = "none";
dojo.style(tooltip, { left: (px + 15) + "px", top: (py) + "px" });
// dojo.style(tooltip, "display", "");
tooltip.style.display = "";
// console.log("updated tooltip pos.");
});

// hide the tooltip the cursor isn't over the map
dojo.connect(map, "onMouseOut", function(evt){
tooltip.style.display = "none";
});



//add this property for debug purpose
window._viewerMap = map;

MapUrlParamsHandler.postProcessUrlParams(this.urlParams, map);

console.timeEnd('Load Map');
if (this.map) {
this.map = map;
this.resetInfoWindow(true);
console.log('map changed.');
topic.publish('mapChanged', this.map, this.layerInfosObj);
} else {
this.map = map;
this.resetInfoWindow(true);
topic.publish('mapLoaded', this.map, this.layerInfosObj);
}

require([
'esri/graphic',
'esri/symbols/SimpleMarkerSymbol',
'esri/symbols/SimpleLineSymbol',
'esri/Color'
],
lang.hitch(this, function(Graphic, SimpleMarkerSymbol, SimpleLineSymbol, Color){
var symbol = new SimpleMarkerSymbol(
SimpleMarkerSymbol.STYLE_CIRCLE, 0.01,
new SimpleLineSymbol(
SimpleLineSymbol.STYLE_CIRCLE,
new Color([207, 16, 45, 0.9]),
1
),
new Color([207, 16, 45, 0.9])
);

map.on("click", lang.hitch(this, function(evt){
var gra = new Graphic(evt.mapPoint, symbol);
setTimeout(lang.hitch(this, function(){
var selFeats = map.infoWindow.features;
if(!selFeats){
map.graphics.clear();
map.graphics.add(gra);

//PopupCenter('http://www.xtf.dk','xtf','900','500');



map.infoWindow.setContent('<a href="https://survey123.arcgis.com/share/surveycodexyz?center='+ evt.mapPoint.getLatitude().toString() + ','+ evt.mapPoint.getLongitude().toString() + '&field:Floor_Selection=' + this.SERVICE_ID.split('_')[1]+"_Floor " + '" target="_"><font size="4">Click here to submit a service request</font></a>');

SERVICE_ID: null;

map.infoWindow.show(evt.mapPoint);
}
}), 1000);
}));
}));
},
0 Kudos
23 Replies
RobertScheitlin__GISP
MVP Esteemed Contributor

Joe,

   Your code only executes if the layer is toggled to visible.

if(visible && layer.title=='layername_Main'||layer.title=='layername_Mezz'){

Could this be your issue?

Have you added breakpoints in your code to see what is or is not happening then the label does not change as expected?

0 Kudos
joerodmey
MVP Regular Contributor

weird part is that sometimes it works if I copy the feature in ArcMap and rename it to the appropriate name rather than just publishing a new service and naming it accordingly. If I were to change the "if" would this work:

if(visible && layer.title=='layername_Main'||visible && layer.title=='layername_Mezz'){
0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Joe,

  No, both of those expressions are equivalent.

0 Kudos
joerodmey
MVP Regular Contributor

suggestions?

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Do you hit your breakpoint in the code when you toggle all the time?

But when I toggle back to main, it stays at mezz

So do you hit the breakpoint in this instance?

0 Kudos
joerodmey
MVP Regular Contributor

When I toggle from mezz back to main the link still stays at mezz. When examined thru a breakpoint (at the if statement level) the if statement is executed at this point as visible is set to true.

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Joe,

  So do you have multiple layer toggle buttons in the app? I set two up and added your code to the MapManager and when I toggles on layer off and another on the serviceId updated just fine to the last layer I toggled on.

0 Kudos
joerodmey
MVP Regular Contributor

I only have one toggle button in my app

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Joe,

   OK. So I am confused then what do you mean by

When I toggle from mezz back to main the link still stays at mezz.

Then?

0 Kudos