Turn off visibility of line featurelayer

[KeithGanzenmuller]

I'm putting together a self-hosted shortlist map for our Capital Improvment Program.
Can be found here temporarily

It has 2 point layers for the tabs and another layer of line features. The line features are from a hosted featureservice created from an uploaded shapefile. In the end I will use the line features so I can reduce the number of point locations in the Road Maintenance tab.

What I am trying to do is get a reference to that layer and conditionally turn its visibility off or on. I can loop through the operationalLayers like so to test:
 

var layers = response.itemInfo.itemData.operationalLayers;    for ( var x = 0; x < layers.length; x++){   alert(layers.id);   }

So the layer I am looking to hide or setVisibility to false shows up as layers[0] (shoes first in the alert statement) but I can't seem to get it to toggle off.

Thank you,
Keith

[KeithGanzenmuller · Accepted solution]

Ok, solved it.

My problem was, I believe, I was trying to get to the layers and setVisibility too soon.
I placed the code:

roadLayer = _map.getLayer('Road_Work_2014_7279'); roadLayer.setVisibility(false);  

in the initMap function and it works now. When I activate a tab it turns on or off the line features as needed.

[RupertEssinger]

Hi Keith
That's great you got that to work and it is a really nice customization of the Shortlist to make additional features appear when the user switches to a different tab.

A couple of suggestions from me:

- The road centerline features that you turn on via the Road Maintenance tabs are a bit hard to see on the map

- The road centerline features can be clickable if you want so users can get a popup about them and also hover over them to get the street name. To do that though they'd need to have the full set of attributes that the Shortlist template expects (same as the point features in your tabs) and would need to be added into your web map as a zipped up shapefile rather than a feature service). (Feature services currently aren't supported as clickable supporting layers in the Shortlist but can be added as non-clickable features like you have done).

- You've added behavior that auto-zooms when the user clicks on a point of interest either in the tabs or in the map. Nothing wrong with that technically but we would perhaps recommend against doing that in the Shortlist template because, as the tabs are context sensitive to the current extent of the map, it means that the contents of the user's tabs will change dramatically as soon as they click on anything, because they'll only see places listed that are inside their current extent, and they have to click the Home button to get back to the initial state where they can see all of the places

[KeithGanzenmuller]

Hey Rupert, thank you for the look and the suggestions.

I agree wholeheartedly about the road centerlines. I definitely have to make them more visible. At the time I copied the site over to the public server I wasn't sure if I could get it to work or not so I didn't bother with changing the symbology. I need to to enhance the centerlines and thin out the points now though.

As for the auto-zoom, good point. I am not sure whether to keep that set to automatically zoom or will add that as a choice on the infoWindow (or perhaps neither). The same goes for the aerial photography that appears when you zoom in far enough. So far there is only one project where the aerial is important. I could set it to come on only if the user selects that project also.

The Departments (and Commissioners) track the CIP Projects on a spreadsheet and they requested the ability to hyperlink from the line in the spreadsheet that contains the project to the CIP (Shortlist) Page so I have a version of it that accepts url parameters then centers and zooms the map to the project.  Still in progress but the roughed in code works.

Thanks KG

[RupertEssinger]

We generally avoid auto-zoom in the story maps so that the user can control the map extent themselves. It can be frustrating for users we feel if they zoom to an extent and scale they are comfortable with only for the app to suddenly override their choice. We do pan the map automatically if the point the user has indicated they are interested in is not currently visible on the map, although that situation never happens in the Shortlist because the tabs don't display places that aren't in the current extent. The map tour has an auto-zoom option that lets the author choose to zoom the user to a specific scale once they start to proceed through the tour, which is nice because authors can start off showing an overview of all the points and then have the map zoom in as the user starts the tour. But even in that case we've built in a rule that if the user does choose to manually zoom the map as they proceed through the tour, the auto-zoom automatically turns itself off to put the end-user in charge of the zoom level.

[LukeFawcett]

Ahh - looking to do the exact same thing here.  One of my tabs is "water CIP" and the other is "sewer CIP".  I'd like to have linework for the sewer CIP projects appear with the sewer tab, and water linework appear with the water tab.  No idea where to start...

Luke

[KeithGanzenmuller]

Hey Luke, I can tell you how I did it and you can easily modify it for more than one layer.

Created a variable for the CIP road layer, like this:

var roadLayer;

In the section for initializing the map i get a reference to the layer and set its visible property to false since my first tab is not for the road maintenance:

function initMap(layers) {

roadLayer = _map.getLayer('Road_Work_2014_7279');
roadLayer.setVisibility(false);

Then to toggle it on or off depending on the tab I do this in the activateLayer function:

function activateLayer(layer) {
 preSelection(); 
 _selected = null;
 postSelection();
 _layerCurrent = layer;

if(_layerCurrent.title == 'C.I.P. Projects') {
roadLayer.setVisibility(false);
} else 
{roadLayer.setVisibility(true);
}

Keith

[LukeFawcett]

Hi Keith - thanks much for your reply!

I see that your "Road_Work_2014_7279" is a FeatureServer layer from an SDE.  Would that make a difference with this functionality?  My line layer is pulling from a MapServer service.  This is really the only difference I see so far.  (Still trying to get the app to load with your added code.  I may send you what I have if you are willing to give it a glance.)

Luke

[KeithGanzenmuller]

My road work layer was just a zipped up shapefile uploaded to ArcGIS Online, not directly to the Web Map but added as an item in My Contents.
I had a hard time getting a reference to it so I had the code loop through the layers to see what name was being used for each layer and discovered that what I called Road_Work_2014 was being called as Road_Work_2014_7279. I don't know where the _7279 came from but it may be a way for ArcGIS Online to uniquely identify its hosted feature services.

You should be able to turn on and off the visibility of any of the layers once you get a reference to them. If you add the layer in code you can use whatever name you gave it.

I'm far from an expert level programmer but I'll certainly have a look at anything for you.

[LukeFawcett]

Keith, finding the right reference to my polyline layer did the trick.  Once I added the unique ID, it worked great!  I also was able to restrict the visibility of several line layers depending on what tab was activated.  Very nice, thanks again.
Luke