Blue highlight box when hovering

[NigelRutter]

Hoping somebody here can help me.

I''m maintaining an application that uses the ArcGIS JavaScript API. I have been asked to remove a blue box that appears when hovering over a marker placed on a map (see attached). I can see that it is drawn by a PATH element inserted into the pages DOM. But can't find how might turn it off.

Thanks in advance

Nigel

[RiyasDeen]

Ok, it's difficult to say what exactly is happening, without seeing your code. Below are few pointers that might help.

1. Provided the highlight is coming on hover, look for mouse-over event for map or feature layer.
2. Most likely you may see something like map.graphics.add in the eventhandler, comment this line and the highlight should be gone.

[NigelRutter]

Thanks, but I think the box is being drawn by code in the ArcGIS API itself and not our code . It definitely isn't being drawn in any of my mouse event handlers.

[NigelRutter]

If it helps this is the contents of the PATH tag that is being inserted

<path fill="rgb(0, 0, 0)" fill-opacity="0" stroke="rgb(0, 255, 255)" stroke-opacity="1" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="4" path="M 338,201 367,201 367,242 338,242 338,201 M 331,221 338,221 M 352,194 352,201 M 374,221 367,221 M 352,249 352,242" d="M 338 201 367 201 367 242 338 242 338 201M 331 221 338 221M 352 194 352 201M 374 221 367 221M 352 249 352 242" transform="matrix(1.00000000,0.00000000,0.00000000,1.00000000,10.00000000,-18.00000000)" fill-rule="evenodd" stroke-dasharray="none" dojoGfxStrokeStyle="solid" style="display: block;"></path>

[JonathanUihlein]

Yes, the API is generating the selection symbol using SVG.

That particular light blue border is the default selection symbol, and its implemented somewhere in your application.

Could you post your code or recreate a sample of your application showcasing the issue using jsfiddle ?

Thanks!

[SteveCole · Accepted solution]

Are you using the popup widget? If so, in the constructor, add "highlight: false" which should prevent that symbol from appearing.

require([
  "esri/dijit/Popup", "dojo/dom-construct", ... 
], function(Popup, domConstruct... ) {
  var popup = new Popup({
    highlight: false,


    offsetX: 10,


    offsetY: 10,
    zoomFactor: 2
  }, domConstruct.create("div"));
  ...
});

[NigelRutter]

Thanks Steve, yes I am using the 'Popup' widget. I'll be trying that later today. Will let you know how it goes.

Regards

Nigel

[NigelRutter]

Steve,

Thank you very much. That was it

Nigel