nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

IE8 and MapImageLayer / MapImage

StuartHarlan

Anyone know of any IE8 limitations on MapImageLayer / MapImage? I can see the layer when using Chrome or Firefox, but not IE8.

Trouver plus de publications taguées avec

Accepted answers

All comments

AndreSmit

Specifying opacity is causing the layer to disappear in IE. We'll look into this. As a workaround, can you only specify opacity if you're in a non-IE browser? Something like ...
if ( ! dojo.isIE ) {
  milRadar.setOpacity(0.5);
}

Given that it's IE8, is a fix possible?

derekswingley1

Thanks for the follow up Len!

LenKne

The map is broken up in several files as it is a MVC application. But Derek's quick response that it seems strange got me thinking about what else could be affect just IE and of course the answer is CSS. I have not pinpointed exactly where the issue is, but have been able to modify the CSS to confirm that's where the issue is. So the issue is specific to my map, not the ESRI API.

Thanks

Len

derekswingley1

I'm seeing a similar issue with IE browsers where the scalebar, zoom slider and popup window opacity is also changing with setOpacity() on any map layer. Is this related to the same issue? I am using version 2.5. If I go back to a map using 2.2, I do not see this problem.

That seems strange...can you post the code you're using? A simple, complete HTML file would be ideal.

LenKne

Derek

I'm seeing a similar issue with IE browsers where the scalebar, zoom slider and popup window opacity is also changing with setOpacity() on any map layer. Is this related to the same issue? I am using version 2.5. If I go back to a map using 2.2, I do not see this problem.

Thanks

Len

StuartHarlan

Thanks for the prompt attention.

derekswingley1

Specifying opacity is causing the layer to disappear in IE. We'll look into this. As a workaround, can you only specify opacity if you're in a non-IE browser? Something like ...

if ( ! dojo.isIE ) {
  milRadar.setOpacity(0.5);
}

StuartHarlan

I took the basic ESRI example "World Topographic Map" and changed a few things. I changed the tiled layer to my own on our production AGS server (SpRef 4326). I also added a map image layer referencing a PNG image from that same server. All are publicly visible layers that we use for our other products. The map image layer is never visible in IE8, but, I can see it in Chrome 14 and Firefox 7. I have included the altered HTML below:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" />
    <!--The viewport meta tag is used to improve the presentation and behavior of the samples 
      on iOS devices-->
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
    <title>Topographic Map</title>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.5/js/dojo/dijit/themes/claro/claro.css">
    <style>
      html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
      .esriScalebar{
        padding: 20px 20px;
      }
      #map{
        padding:0;
      }
    </style>
    <script type="text/javascript">var djConfig = {parseOnLoad: true};</script>
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.5"></script>
    <script type="text/javascript">
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.ContentPane");
      dojo.require("esri.map");
   
  /* require for map image layer */
  dojo.require("esri.layers.MapImageLayer");
      
      var map;

      function init() {
        var initExtent = new esri.geometry.Extent({"xmin":-97,"ymin":34,"xmax":-88,"ymax":41,"spatialReference":{"wkid":4326}});
        map = new esri.Map("map",{extent:initExtent});
        //Add the topographic layer to the map. View the ArcGIS Online site for services http://arcgisonline/home/search.html?t=content&f=typekeywords:service    
        var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://maps.modot.mo.gov/ArcGIS/rest/services/baseMap/baseMapCombined/MapServer");
        map.addLayer(basemap);

  /* mi layer code start */
  var milRadar = new esri.layers.MapImageLayer({
   id: "NwsRadar", opacity: 0.6, visible: true
  });
  var radarMapImage = new esri.layers.MapImage({
   extent: { xmin: -100.164199191007, ymin: 32.421437253085, xmax: -86.0629362487793, ymax: 44.3767001897639, spatialReference: { wkid: 4326} },
   href: "http://maps.modot.mo.gov/timconfig/NWS_0.png"
  });
  milRadar.addImage(radarMapImage);
  map.addLayer(milRadar);
  /* mi layer code end */
  
        dojo.connect(map, 'onLoad', function(theMap) { 
          //resize the map when the browser resizes
          dojo.connect(dijit.byId('map'), 'resize', map,map.resize);
        });
      }

      dojo.addOnLoad(init);
    </script>
  </head>
  
  <body class="claro">
    <div dojotype="dijit.layout.BorderContainer" design="headline" gutters="false" style="width: 100%; height: 100%; margin: 0;">
      <div id="map" dojotype="dijit.layout.ContentPane" region="center" style="border:1px solid #000;padding:0;">
     </div>
    </div>
  </body>

</html>

derekswingley1

Post a repro case?

StuartHarlan

IE is not generating any errors. I have verified that the image is loaded and placed into a DIV in the page. But, still, it is not being displayed over my map. Again, FF and Chrome display it just fine.

derekswingley1

Is IE throwing any errors? Is there a little yellow icon with the black ! in the lower left corner?

Rejoindre la conversation

Les membres connectés peuvent publier, suivre les mises à jour, et plus encore. Nouveau ici ? Inscrivez-vous gratuitement.

Liens rapides

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.