How to deactivate the scroll down function on an embedded WAB app?

695
6
Jump to solution
11-23-2016 04:04 PM
PabloIzquierdo1
New Contributor III

Hi all,

I'm trying to embed a developer version of our WAB app on a website, but I'm not able to deactivate the scroll down function, I've tried with overflow: hidden; on the iframe and in the source code, but it doesn't work.

I'm looking forward for an answer on this issue because I know I'm not the only one with this question.

Thanks,

Pablo

0 Kudos
1 Solution

Accepted Solutions
RobertScheitlin__GISP
MVP Esteemed Contributor

Pablo,

  I would try it here:

      _publishMapEvent: function(map) {
        map.graphics.enableMouseEvents();
        map.disableScrollWheelZoom();
        map.disableMapNavigation();
        //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);
        } else {
          this.map = map;
          this.resetInfoWindow(true);
          topic.publish('mapLoaded', this.map);
        }
      },

View solution in original post

6 Replies
RobertScheitlin__GISP
MVP Esteemed Contributor

Pablo,

   Have you seen this thread? https://community.esri.com/thread/169202 

PabloIzquierdo1
New Contributor III

Robert,

Thanks, I've tried that, but I couldn't find where to modify the code of my WAB, there are a lot of folders and sub-folders, and at the end, I get lost.

Where can I find the div of the "map"? or do I have to modify a Js?

Is there any option to add something simple as the following?

          map.disableMapNavigation();          map.disableKeyboardNavigation();          map.disablePan();          map.disableRubberBandZoom();          map.disableScrollWheelZoom();
0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Pablo,

   The map div can be found in the jimu.js/MapManager.js

PabloIzquierdo1
New Contributor III

I'm trying to add the below lines of code in the jimu.js/MapManager.js, but I'm not able to find where it should put them. I'm not an expertise in JavaScript, so it is not easy for me to understand all these lines of code

map.on("load", function(){
map.graphics.enableMouseEvents();
map.disableScrollWheelZoom();
map.disableMapNavigation();
});

Thanks again for all your help.

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Pablo,

  I would try it here:

      _publishMapEvent: function(map) {
        map.graphics.enableMouseEvents();
        map.disableScrollWheelZoom();
        map.disableMapNavigation();
        //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);
        } else {
          this.map = map;
          this.resetInfoWindow(true);
          topic.publish('mapLoaded', this.map);
        }
      },

View solution in original post

PabloIzquierdo1
New Contributor III

Robert,

It works!!! thank you so much for all your help. I really appreciate it.

0 Kudos