Change the highlight symbol for a selection

9390
29
Jump to solution
08-12-2015 11:13 AM
NathanielRoth
New Contributor III

Is it possible to change the symbol used to highlight a feature that has been clicked on (i.e. to show the popup info)? I can see and edit the symbols live through the debugger, but haven't been able to figure out where to make changes so that they'll be permanent.

On a related note, is there a preferred location for setting custom css properties to override existing ones?

I'm currently using Web AppBuilder-Developer's Edition 1.1.

Thanks,

0 Kudos
29 Replies
LeeAllen
Occasional Contributor

Thank you Robert, I've been staring at code all day and this was my last endeavor... The thread is exactly what I needed!

0 Kudos
LeeAllen
Occasional Contributor

Robert,

I have the code working correctly, but need one more adjustment. I have tried fruitlessly this morning to set the fill to 100 % transparent and can't seem to find the correct reference. I tried using "style": "esriSFSNull" which does not seem to work. Here is my current code that still puts a red fill with my updated yellow line (the red fill looks about 50% transparent??).

map.infoWindow.fillSymbol = new SimpleFillSymbol({

  "type": "esriSFS",

  "style": "esriSFSSolid",

  "color": [0,0,0,0],

  "outline": {

  "type": "esriSLS",

  "style": "esriSLSSolid",

  "color": [255,255,51,255],

  "width": 5

  }

   });

RobertScheitlin__GISP
MVP Emeritus

Lee,

  Use:

"style": "esriSFSNull",

AveKargaja
Occasional Contributor

Coming back to the topic, then this suggested solution works very well on desktop layout, but as soon as the app switches to mobile version, then the highlight symbol is again the defaul "blue". Any ideas?

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Ramon,

  That is because the mobile version uses a different popup and thus you have to set the popup symbology for that popup.

In the MapManager.js

resetInfoWindow: function(isNewMap) {
        if(isNewMap){
          this._mapInfoWindow = this.map.infoWindow;
          if(this._mapMobileInfoWindow){
            this._mapMobileInfoWindow.destroy();
          }
          this._mapMobileInfoWindow =
          new PopupMobile(null, html.create("div", null, null, this.map.root));
          this.isMobileInfoWindow = false;
        }
        if (window.appInfo.isRunInMobile && !this.isMobileInfoWindow) {
          this.map.infoWindow.hide();
          this.map.setInfoWindow(this._mapMobileInfoWindow);
          this.isMobileInfoWindow = true;
        } else if (!window.appInfo.isRunInMobile && this.isMobileInfoWindow) {
          this.map.infoWindow.hide();
          this.map.setInfoWindow(this._mapInfoWindow);
          this.isMobileInfoWindow = false;
        }
        this.map.infoWindow.fillSymbol = new SimpleFillSymbol({
          "type": "esriSFS",
          "style": "esriSFSSolid",
          "color": [255,0,0,25],
          "outline": {
             "type": "esriSLS",
             "style": "esriSLSSolid",
             "color": [255,0,0,255],
             "width": 2
             }
        });
        this.map.infoWindow.markerSymbol = new SimpleMarkerSymbol({
          "color": [255,0,0,64],
          "size": 15,
          "angle": -30,
          "xoffset": 0,
          "yoffset": 0,
          "type": "esriSMS",
          "style": "esriSMSCircle",
          "outline": {
            "color": [255,0,0,255],
            "width": 2,
            "type": "esriSLS",
            "style": "esriSLSSolid"
            }
        });
      },
AveKargaja
Occasional Contributor

Thank You once again, Robert Scheitlin, GISP

0 Kudos
ChristopherJohnson1
Occasional Contributor II

Robert, thanks for taking the time to give back to the community!  Your responses are always RIGHT on!!!

0 Kudos
deleted-user-bWhhezP4R-ec
New Contributor III

Hi Robert,

Does this still work in WAB version 2.8? I have been trying to add in a new fillSymbol, but the color of the select is not changing. There's a bunch new code at the bottom of the _show2DWebMap function than there was when this question was answered in 2015. I don't know if that has any effect.

Thank you!

0 Kudos
deleted-user-bWhhezP4R-ec
New Contributor III

Never mind! I was trying to do a Fill Symbol when I should have been doing a Fill Line. I can confirm, this still works in 2.8.

0 Kudos
PatrickThorsell
New Contributor III

Robert,

Will these changes work for WAB 2.4?

Thanks!

0 Kudos