One of the great new features of the Esri 4.X Javascript API is the new layer filtering capability. We’ve included commands for doing this inside Geocortex Web.
Layer filter effects allow you to dynamically change the visual appearance of your map as an integral part of your application.
In this tech tip, we’re going to use charting as an example on how to use layer filter effects in Geocortex Web.
Video Transcript
“Hi there. My name is Cam Barnard, Product Manager for Geocortex Web. Today, I am going to walk you through something that is exciting that is part of Esri’s Javascript 4.X API called layer filter effects.
Layer filter effects allow you to dynamically change the visual appearance of your map as an integral part of your application. We’re going to use charting as an example, I think you’ll like it. Let’s get started!
One of the great new features of the Esri 4.X Javascript API is this new layer filtering capability. We’ve included commands for doing this inside Geocortex Web.
So, to kick it off, let me show you a fairly standard ‘Identify’ operation on some buildings on a map that I configured with a chart. You can see below my chart, it’s showing you average building height along the streets.
In this case, Belleville St has some high buildings, Quebec St has some high buildings.
Now, when I did this Identify, you can see that I’ve got a bunch of highlighting here and as I mouse over the chart, I can see those items focused.
It’s effective, but it’s a little busy, a little crowded. So, we’re going to make a couple of changes to this app to show you how to make this work.
The first thing I’m going to do is actually drill into my ‘Results’. I’m actually going to remove the ‘highlights.add’ capability. What that’s going to do for us is now when we do an Identify, I don’t want to see all that purple highlighting, I just want to see my chart and as I mouse over, I see these things glowing blue.
Now, that’s pretty good, but it doesn’t yet do the filter effects that I want to show you. So, we are now going to modify our chart, and we are going to change the highlighting in our chart to use the layer filter effects.
The way we are going to do that is that we are going into our ‘Chart’, going into ‘Events’, and you can see today we got on point hover and hover end and it’s both adding and removing focus. No big surprise there, but we are going to change these up.
We are going to use this ‘Apply Filter Effect’ option. We are specifically going to focus on buildings and we are going to include and let’s start off with the ‘Juxtapose’ and now we are going to change this one. Also, applying a filter effect on hover end also on buildings and we are going to exclude, and let’s use the same.
So, based on those changes now, If I do an Identify on my map, you’re going to get a very different behavior on mouseover. You can see the buildings fade out, that’s using the layer filter effects.
I actually quite like this one, it’s called ‘Neutralize’ and it actually fades everything out except what is highlighted, so that really makes it pop in terms of using the layer filter effects.
Now, we’ve pre-created a bunch of these for you, you can, of course, customize this as you always can within our interface, get in here if you really want to and set your own RGB brightness, contrast, and all the rest of it.
That is layer filter effects inside of Geocortex Web. You can use them anywhere you would usually use highlighting. Thanks for listening!”
Want to see more of what Geocortex Web can do? Click the button below to learn more information, or to book a personal demo.
Contributors