After we were able to rectify the image quality issue with ESRI’s online services, our next hurdle was to pick and choose functionality that we wanted to customize through our MapViewer. The first two were transparency and a basemap switcher.
However, the next task was to start to incorporate other tools which were not readily integrated into the ESRI online mapping platforms, which were basically ArcGIS Javacsript API and ArcGIS.com viewer.
The first hurdle was to implement a swipe effect, which had two examples:1) From ESRI and 2) from Mapbox.
1) ESRI’s Swipe tool (more like web template) had over 1000 lines of code that would force us to conform to their template because of its overarching complexity and dependency on ESRI javascripts:
2) Mapbox’s Swipe Tool was done in less than 100 lines of code and no dependencies outside of leaflet.
However, the map above was done using a map layer in front which was clipped by another layer contained by the handle’s layer. So in order to replicate this tool, we had to find the equivalent of the map layers being used in ESRI’s Javascript API (EJA) in addition to the location of the handle bar on the page. (that, once again, we decided to go with because of ease after georeferencing).
After a couple of days we were able to mimic the basic functionality of the swipe by identifying the active map layer in ESRI’s Javascript API as “layer._div.firstChild” and tracking the x-location of the mouse.