Web app - how to replace ESRI branding with a custom graphic?

Question

Alough there apears to be an easy way to remove the "Powered by ESRI" graphic in JSON I would like, rather than removing it, to substitute it with a custom PNG.

When I set "Logo": false, in "mapOptions" the Esri logo turns off but if I set the logo to an existing valid PNG, rather than displaying it, the custom graphic is somehow over-ridden and the "Powered by ESRI" graphic is displayed.

Any ideas how to replace the default with a custom graphic?

Default graphic:

Setting the logo to a valid PNG has no effect:

Setting the logo to false works!

Result:

Bill B · Accepted Answer

The "logo" option is documented as being a Boolean value that defaults to true. So if you put false, it won't show it; if you enter any value (or leave it off so it defaults to true), it will show their logo. (This is because JavaScript interprets any non-null value as true.) So you're left with the option to set it to false, and float your own logo over the map.

Correct answer by Bill B on March 20, 2021

Engman · Answer

As Bill B says this is the solution. To add your own logo in Javascript I found the following works.

In the index.html file: Add a css style:

    #logo{ 
        position: absolute; 
        z-index: 100000; 
        bottom: 5%; 
        right: 1%;}

Add a div:

<div id="logo"> <img src="linktoimage source" width="200" > </div>

This puts my logo in the bottom right hand corner.

Web app - how to replace ESRI branding with a custom graphic?

2 Answers

Add your own answers!

Ask a Question