Listener for layer toggle widget

4260
68
Jump to solution
07-20-2018 07:37 AM
MarkLache1
New Contributor III

How would I add a listener to Robert's layer toggle widget that would be able to tell what layer is on? I want this so that the info can be passed into Survey123 via custom URL

Thanks

0 Kudos
1 Solution

Accepted Solutions
RobertScheitlin__GISP
MVP Emeritus

Mark,

   So where is your topic subscribe to the "toggleChanged" in the above code?..

      _publishMapEvent: function(map) {
        topic.subscribe('toggleChanged', lang.hitch(this, function(visible, layer){
           //console.info(visible, layer);
           if(visible){
             this.SERVICE_ID = layer.id;
           }
        }));
        //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,
          12,
          new SimpleLineSymbol(
            SimpleLineSymbol.STYLE_NULL,
            new Color([247, 34, 101, 0.9]),
            1
          ),
          new Color([207, 34, 171, 0.5])
        );
          map.on("click", lang.hitch(this, function(evt){
            map.graphics.clear();
            map.graphics.add(new Graphic(evt.mapPoint, symbol));
            map.infoWindow.setContent('<a href="https://survey123.arcgis.com/share/' + this.SERVICE_ID + '?center='+evt.mapPoint.getLatitude().toString() +","+ evt.mapPoint.getLongitude().toString()+'" target="_blank"><font size="4">Click here to submit a service request</font></a>');
            map.infoWindow.show(evt.mapPoint)
          }));
        }));
      },‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

View solution in original post

68 Replies
RobertScheitlin__GISP
MVP Emeritus

Mark,

   Where will you be listening to this event from? Another widget?

0 Kudos
MarkLache1
New Contributor III

Not necessarily. Just need to capture the layer (or if the toggle is on or off) so that I can use it in Survey123 to populate a question. Will be used to determine if on main floor or second floor of a building

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Mark,

   The 2.8 version of the layer toggle button dispatches a "toggleChanged" event that can be listened to using dojo/topic subscribe in your code.

0 Kudos
MarkLache1
New Contributor III

How would I incorporate this into my app?

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Mark,

  As I mentioned in my last post you would add the require for dojo/topic and then use topic.subscribe('toggleChanged', function(){ //your code });

0 Kudos
MarkLache1
New Contributor III

Which file in the WAB structure do I incorporate this?

Do you have a larger code example?

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Mark,

   No I do not have a sample for this. You implement the dojo topic subscribe in whatever file that you will need to do something with the event in.

0 Kudos
MarkLache1
New Contributor III

I just need to capture which layer is turned on (in my case its floor 1 or floor 2 of a building) and ad this into the URL to pass into Survey123. Not really doing anything with it in WAB

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Mark,

   Well you need to listen for this event somewhere so that you add it to your url.. So I guess you can do that in the MapManager.js or some file that is used automatically in WAB.

0 Kudos