topic Re: Mouse Hover To Show Data In WAB App in Web AppBuilder Custom Widgets Questions

Mouse Hover To Show Data In WAB App

joerodmey — Wed, 05 Jun 2019 16:13:27 GMT

I have an app built in WAB that I want the mouse to trigger popups on hover. Been playing around with it a bit and trying to add code to MapManager.js in the publishMapEvent function

Tried using info window and mouse over but not luck.

Any ideas?

Re: Mouse Hover To Show Data In WAB App

RobertScheitlin__GISP — Wed, 05 Jun 2019 16:20:29 GMT

Joe,

I have a widget for that already.

https://community.esri.com/docs/DOC-13431-feature-layer-hover-widget-version-211-051219

Re: Mouse Hover To Show Data In WAB App

joerodmey — Wed, 05 Jun 2019 16:47:28 GMT

Now I want to take that and make the popup an info window

Re: Mouse Hover To Show Data In WAB App

RobertScheitlin__GISP — Wed, 05 Jun 2019 17:06:10 GMT

Joe,

What is your understanding of the difference between a Popup and an InfoWindow?...

Re: Mouse Hover To Show Data In WAB App

joerodmey — Wed, 05 Jun 2019 17:47:04 GMT

Or maybe ill clarify....Can the popup style be changed to something else?

Re: Mouse Hover To Show Data In WAB App

RobertScheitlin__GISP — Wed, 05 Jun 2019 17:54:34 GMT

This widget is designed to show the feature standard popup on hover (just like it would if you clicked on the feature). Not sure what you mean by change the style?

Re: Mouse Hover To Show Data In WAB App

joerodmey — Wed, 05 Jun 2019 18:51:18 GMT

More like a tooltip style

Re: Mouse Hover To Show Data In WAB App

RobertScheitlin__GISP — Wed, 05 Jun 2019 18:59:57 GMT

For that you would have to take the widget as a starting point and have it show a dijit/TooltipDialog on mouse over instead of the standard esri Popup.

Re: Mouse Hover To Show Data In WAB App

joerodmey — Wed, 05 Jun 2019 19:09:12 GMT

Thanks ill give it a shot.

I also have a map.on("click"... command and a info window that displays when a user clicks on the map. As these 2 commands will fight each other, how do I get the on click to beat out your hover widget?

Re: Mouse Hover To Show Data In WAB App

RobertScheitlin__GISP — Wed, 05 Jun 2019 19:21:49 GMT

Add code in your onclick to close the tooltip.

Re: Mouse Hover To Show Data In WAB App

joerodmey — Sun, 12 Dec 2021 09:00:04 GMT

Where/what would I add into my code? Also how do I get the popup to only fire once when it hits a polygon? Right now it keeps firing every time it hits my polygon and I would like to see the popup to only show once and will only fire again if I manually close it.

Here is a snippet of my publish map event function

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, 0.01,
          new SimpleLineSymbol(
            SimpleLineSymbol.STYLE_CIRCLE,
            new Color([207, 16, 45, 0.9]),
            1
          ),
          new Color([207, 16, 45, 0.9])
        );
		
          map.on("click", lang.hitch(this, function(evt){
            var gra = new Graphic(evt.mapPoint, symbol);
            setTimeout(lang.hitch(this, function(){
              var selFeats = map.infoWindow.features;
              if(!selFeats){
                map.graphics.clear();
                map.graphics.add(gra);
				
				//PopupCenter('http://www.xtf.dk','xtf','900','500');  
				
				
				
                map.infoWindow.setContent('<a href="https://survey123.arcgis.com/share/Survey123 ID?center='+ evt.mapPoint.getLatitude().toString() + ','+ evt.mapPoint.getLongitude().toString() + '&field:Floor_Selection=' + this.SERVICE_ID.split('_')[1]+"_Floor " + '" target="_"><font size="4">Click here to submit a service request</font></a>');
				
				SERVICE_ID: null;
				
                map.infoWindow.show(evt.mapPoint);‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Mouse Hover To Show Data In WAB App

joerodmey — Fri, 07 Jun 2019 14:58:03 GMT

How would I make this widget allow multiple layers to be included for hover popups?

Re: Mouse Hover To Show Data In WAB App

RobertScheitlin__GISP — Fri, 07 Jun 2019 15:02:26 GMT

Each FeatureLayer has it's own mouse event so that is not practical.

Re: Mouse Hover To Show Data In WAB App

joerodmey — Fri, 07 Jun 2019 15:13:44 GMT

Good to know.

How do I get the popup to only fire once when it hits a polygon? Right now it keeps firing every time it hits my polygon and I would like to see the popup to only show once and will only fire again if I manually close it.

Re: Mouse Hover To Show Data In WAB App

RobertScheitlin__GISP — Fri, 07 Jun 2019 15:16:46 GMT

I thought you were going to use a tooltip dijit, not a popup?... A tooltip does not have a close.

Re: Mouse Hover To Show Data In WAB App

JohnRogers541 — Wed, 28 Jun 2023 20:48:05 GMT

Hi, how do you import this widget into WAB after downloading?