How to set a Map Background Color with HTML5?

Permanently deleted user

23. Juli 2013 22:07

Hello,

In the Silverlight viewer, there is this section of code in the named viewer .xaml file that allows you to set a background color.  This is very helpful to set a background color to the the ocean by setting this to a light blue color:

<!--BEGIN: Map -->

<SolidColorBrush x:Key="MapBackgroundColor">#a5bfdd</SolidColorBrush>

<!--END: Map -->

Is there a way to set this for the HTML5 viewer?   We would like to have our Silverlight and HTML 5 users to have a similar experience and our goal is not to have to add "water" data layer to each ArcGIS Server Map Service.

Thanks,

Reily

0

• 

  Permanently deleted user

  24. Juli 2013 05:32

  Thanks, Jordan!

  I'm not using the installed template but deploy the HTML5 viewer manually to Inetpub.

  Well, that did change the background but also covers up the ZoomIn, ZoomOut, and My Location buttons on the HTML5 Handheld viewer.  On the tablet and desktop (index.html) it pushes those UI buttons down into a different region altogether so that the map is on top with no controls and the ZoomIn and ZoomOut are below the map window in their own secton of the screen.

  As I'm primarily working on the Handheld.html, I tried to add a 'z-index' field to what you had above but that does not solve the problem:

  .map {

              background-color: #A5BFDD;

              z-index: 0;

  }

    I think the handheld is probably doing the same thing as the other two where these controls are now in a seperate section of the screen:

  (/customer/servlet/servlet.FileDownload?file=00P6000000e88UYEAY) /customer/servlet/servlet.FileDownload?file=00P6000000e88UYEAY

  0
• 

  Permanently deleted user

  26. Juli 2013 04:41

  Well, that's unexpected. I haven't been able to reproduce that behaviour so I'm at a bit of a loss. Which version of the viewer are you running? Which browser are you using? Does this happen in other browsers? Have there been any other changes made to the viewer layout or styling?

  0
• 

  Permanently deleted user

  15. Juni 2018 14:02

  Hi all,

   

  I was able to reproduce the same behaviour where the controls get bumped down below the map.  Saying this, I was able to find a solution that seemed to work for me.  In the same "Mapping/modules/Map/CSS/common.css" section that Jordan suggested, I added the background-color parameter to the .MapView section:

   

  .MapView {

   

      height: 100%;

   

      background-color: #000000;

   

  }

   

  This seemed to work as expected.

  0

Bitte melden Sie sich an, um einen Kommentar zu hinterlassen.