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; } } }

FeatureLayer not showing image in Internet Explorer 8 or 9

dimesv

Dear ArcGIS Javascript API Team,

I have configured a secured MapService with a single layer (Picture Marker Symbol) using the proxy page from Esri.

I have configured everything as told on the Javascript documentation about the proxy and if I use the mapservice as an ArcGISDynamicMapService it works fine and the proxy is triggered correctly.

When I create a FeatureLayer pointing to the map service layer and add it to the map, I have realized that Internet Explorer 8 or 9 cannot show the images (Base64). The proxy page is being triggered and I believe is missing something in the response code.

Google Chrome shows perfectly well all symbology.

Can please someone provide me guidance on this?

Cheers,
José Sousa

Encuentra más publicaciones etiquetadas con

Accepted answers

All comments

DaveHighness

I applied sashom and sRoberts fix above and it worked. Had same problem, feature service symbols not rendering for secured service; IE 8, ArcGIS Server 10.2, ArcGIS Server Javascript API 3.6. Apparently ESRI has not seen fit to fix this in the API.

DanielMoldovan1

I have the same issue on IE8. It works on IE9 and other browsers. I'm using a proxy and I did apply the fix that was suggested and I can see using HTTPWatch that the image url that is used by the picture symbol goes through the proxy and is resolved. Still the image does not show up. I'm using the map in a ExtJS 4.1 window.
Anybody had any success with this on IE8?

Thanks,

Daniel

DavidAglietti

Hello,
I was also having this problem whereby my featurlayer would not display in IE 9. I tried the solutions above with no success. However, setting the mode to ONDEMAND did resolve the problem for me. BTW, I was not using a proxy.
David

__Rich_

When I monitor the http calls

Excellent - can you capture the request URIs (and the HTTP headers etc.) and post them here?

I am using secure services by the way.

Not overly familiar with the process but I think the URIs will reveal the issue.

Why would I be able to display the polygon and line symbology but not the point symbology, with or without the proxy?

Some symbols can be rendered on the client, some need to be rendered (as images) on the server - sounds like your point symbols are the latter. (depends on the type of symbol, the browser being used etc.)

DonCavinessGeo

I have a proxy set up to be used if necessary but I'm not explicitly forcing any of the calls to go through the proxy. When I monitor the http calls, the proxy never gets called from any browser, even the ones that the code works with. I am using secure services by the way. Why would I be able to display the polygon and line symbology but not the point symbology, with or without the proxy?

__Rich_

Has anyone found a solution to this IE8 issue? I am having the same trouble trying to display a featureLayer that are points (polygons and lines work like they should). I am getting all of the data returned from the server but all that is being displayed is a hollow square in place of the point symbol. I am using simple points. I have tried the solutions found here but none work. Everything works as it should in IE9, Firefox or Chrome.

Are you going through a proxy to communicate with AGS?

DonCavinessGeo

Has anyone found a solution to this IE8 issue? I am having the same trouble trying to display a featureLayer that are points (polygons and lines work like they should). I am getting all of the data returned from the server but all that is being displayed is a hollow square in place of the point symbol. I am using simple points. I have tried the solutions found here but none work. Everything works as it should in IE9, Firefox or Chrome.

__Rich_

@Ben - apologies if you've already checked this and/or posted the results but have you monitored the network traffic from IE using either the built-in tool (ie9 only) or Fiddler?

BenSayers

I'm having the same trouble yet none of the fixes suggest here or on other posts work.
The legend symbols work fine in Firefox and Chrome, but not in IE.
I am using AGS10.04 and JSAPI v2.8.
It is definitely something to do with the secure layers as before switching to a token service they worked fine.
If anyone has found a way around this please let me know.
Many thanks,
Ben

__Rich_

Could it be the developers forgot about proxies when building the URLs to retrieve images from the server for older browsers?

Surely not. (same issue with legends btw)

SebastianRoberts

Thanks cminde7 and Sashom,
I was having the same problem, and your solution fixed it. I had to make a change because I symbolize my layer with only one marker symbol (instead of categories or class breaks), so I don't have an array of infos. So the code below might be more robust and be able to deal with both situations.

function fixIELayers(evt)
 {
  // IE FIX FOR IMAGES NOT SHOWING IN FEATURE LAYER!!!
  if (dojo.isIE) 
  {
    var currentLayer = Hydrants; //map.getLayer(map.layerIds);
    if(currentLayer && currentLayer.renderer && currentLayer.renderer.infos)
    {    
     for (var i=0; i<currentLayer.renderer.infos.length; i++)
     {
      var url1=currentLayer.renderer.infos.symbol.url;
      var url2=esri.config.defaults.io.proxyUrl+'?';
      if (url1.indexOf(url2) != -1)
       continue;
      var url3=url2+url1;
      currentLayer.renderer.infos.symbol.url = url3;
     }
    }else if(currentLayer && currentLayer.renderer && currentLayer.renderer.symbol)
    {
     var url1=currentLayer.renderer.symbol.url;
      var url2=esri.config.defaults.io.proxyUrl+'?';
      if (url1.indexOf(url2) == -1)
      {
       var url3=url2+url1;
       currentLayer.renderer.symbol.url = url3;
      }
    }
  }
 }

DanielYim

If it's not a proxy page issue, I've had a problem with FeatureLayers in IE because they are drawn on a strange graphics layer.

To fix this, make sure your explicitly set the CSS on your map's div to text-align: left;.

Reference to my post that solved this issue that Derek graciously helped me with.

TatianaTen

Hi all,
I'm working on something similar here, tried out a sample code for defaultediting from arcgis.com (javascript api samples) with my secure services. Strangely, everything worked for me.
I'm using ArcGIS Server 10.0 and JavaScript API 2.3 (<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.3"></script>)
Tried it on IE 8, 9 browsers and also in IE7 mode.
For the Picture Marker Symbol image, I used .bmp image file.

What file are you using?

Can you run the IE debugger to see if it gives you any error?

OzanEmem

i am having a very similar problem.
feature services are secure and using proxy for the connection. All works fine in IE9, Chrome and FF including editing etc.
however symbols are not showing up on the screen in IE8 and IE7 for featurelayer.
when i check the request using fiddler, i can see that IE8 and IE7 are requesting images from secure services without proxy. eventually it gets redirection from server and doesnt show .
i tried your solution folks, but no joy.
any idea?
by the way i am using Javascript API 2.3 and AGS 10 SP2.

AlexanderMardirossian

Actually it works now. It did not work before due to some misconfiguration in IIS.

Here we go the code that I put to work for me:

function init() { // called with dojo.onLoad
// `map` is the main map with basemap both already set....
         dojo.connect(map, "onLoad", function() {
                template = new esri.InfoTemplate();
  template.setTitle("mytitle");
  template.setContent(getTextContent);
  var HGLayerURL2 = [myfeaturelayer's url];
// note that below i don't declare the HGLayerMap - it is already declared outside this function
  HGLayerMap = new esri.layers.FeatureLayer(HGLayerURL2, {
      mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
      infoTemplate:template,
      outFields: [list of my fields hrere...]
  });
  map.addLayer(HGLayerMap);
                dojo.connect(map,"onUpdateStart",function(){
         // some of my code comes here...
   fixIELayers();  // the fixer...
  });
  // some more code here.....
 });
 
 return true;
}  // end of init()

dojo.addOnLoad(init);
// END INIT PART!

function fixIELayers(evt)
{
 // IE FIX FOR IMAGES NOT SHOWING IN FEATURE LAYER!!!
 if (dojo.isIE) 
 {
   var currentLayer = HGLayerMap; //map.getLayer(map.layerIds);
   if(currentLayer && currentLayer.renderer && currentLayer.renderer.infos)
   {    
    for (var i=0; i<currentLayer.renderer.infos.length; i++)
    {
     var url1=currentLayer.renderer.infos.symbol.url;
     var url2=esri.config.defaults.io.proxyUrl+'?';
     if (url1.indexOf(url2) != -1)
      continue;
     var url3=url2+url1;
     currentLayer.renderer.infos.symbol.url = url3;
    }
   }
 }
}

That's all folks.

I hope this helps someone...

Cheers

AlexanderMardirossian

Hi all, I also have the same problem and need urgent solution.

I have tried (a customized and optimized version of ) the source code provided by cminde7,

but don't seem to be able to figure out which event to point it to.
I have tried to put it to onUpdateStart - with a doubful success. One ever 4 times or so , some of the images appear. The rest of the time They are gone...

Help!

AdministratorGlitrevannverket_

I had same problem, this is what I have made:
Basicaly the IE gets wrong url without proxy, you have to add it manually.
      dojo.forEach(layers, function(layer)
    {

        if (dojo.isIE) {
        if(layer.renderer.infos){
         for (var i=0; i<layer.renderer.infos.length; i++){
        var url1=layer.renderer.infos.symbol.url;
//         alert(url1);
        var url2="http://"+server+"/proxy.jsp?";
//             alert(url2);
             var url3=url2+url1;
         layer.renderer.infos.symbol.url=url3;
        }
        }

   }
worked for me

I have the same issue, it works in Google Chrome, but not in IE9.
Where will I insert the code above in my javascript code to get it work in IE9 ?
I use "same" code as José Sousa does above in this thread.

Br
Christian

dimesv

Hi,

It seems to make sense.
I'll try it when I have a chance.

Thanks,
José

Mindaugas_ižas

I had same problem, this is what I have made:
Basicaly the IE gets wrong url without proxy, you have to add it manually.
      dojo.forEach(layers, function(layer)
    {

        if (dojo.isIE) {
        if(layer.renderer.infos){
         for (var i=0; i<layer.renderer.infos.length; i++){
        var url1=layer.renderer.infos.symbol.url;
//         alert(url1);
        var url2="http://"+server+"/proxy.jsp?";
//             alert(url2);
             var url3=url2+url1;
         layer.renderer.infos.symbol.url=url3;
        }
        }

   }
worked for me

dimesv

If I change the symbology to SimpleMarkerSymbol works ....

An interesting fact is that when using a FeatureLayer with secured services (proxy page) and PictureMarkerSymbol (embed image inline) IE cannot display it. I even tried to used a layer from a FeatureServer.

If I open 2 IE browers with the below settings and try to use the viewer it works fine.
- The first one with the viewer;
- The second one with the REST page. Navigate through the map service layer or featureserver layer and login for authentication.

After I become authenticated on the rest page I can use the viewer normally. If I logout from the REST page it stops working ...

Hope this helps going further...

José

dimesv

Hi,

This is the my page code:

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true"
    CodeBehind="Map.aspx.cs" Inherits="CPA_Web.Secure.Map" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server"></asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <div id="map" region="center" style="overflow: hidden; padding: 0px; margin: 0px"></div>
    <script type="text/javascript">
        djConfig = { parseOnLoad: true };
    </script>
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis?v=2.1"></script>
    <script type="text/javascript">
        dojo.require("esri.map");
        dojo.require("esri.layers.FeatureLayer");

        var map;
        var AgsEventsUrl;
        var resizeTimer;

        function init() {
            esri.config.defaults.io.proxyUrl = 'http://CPAVM/CPA/Secure/proxy.ashx';
            esri.config.defaults.io.alwaysUseProxy = true;

            var initExtent = new esri.geometry.Extent({ "xmin": 19598934.677, "ymin": -4662883.306, "xmax": 19869556.047, "ymax": -4491611.673, "spatialReference": { "wkid": 102100} });

            map = new esri.Map("map", { extent: initExtent, logo: false });

            dojo.connect(map, 'onLoad', this, _mapLoadHandler);

            var operationsLineLayer = new esri.layers.FeatureLayer('http://CPAVM/ArcGIS/rest/services/Watchers/CPAWatchers/MapServer/0',
                                                                  {
                                                                      mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
                                                                      outFields: ["*"]
                                                                  });
            map.addLayer(operationsLineLayer);
        }

        function _mapLoadHandler(theMap)
        {
            dojo.connect(window,
                         'onresize',
                         function ()
                         {
                             // Resize the map if the div is resized
                             clearTimeout(resizeTimer);
                             resizeTimer = setTimeout(function()
                                                      {
                                                         setHeight('map', 170);
                                                         if (map)
                                                         {
                                                             map.resize();
                                                             map.reposition();
                                                         }
                                                      },
                                                      500);
                         });
        }

        dojo.addOnLoad(init);
    </script>
    <script language="JavaScript" type="text/javascript">
        setHeight('map', 170);
    </script>
    <noscript>
        <h4>
            Your browser doesn't support or doesn't have javascript enabled.
        </h4>
    </noscript>
</asp:Content>

Is there any problem?

Cheers,
JosÃ©

dimesv

More details:

The returned image on the Google Chrome is:
<image fill-opacity="0" stroke="none" stroke-opacity="0" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="4" x="-15" y="-15" width="29" height="29" preserveAspectRatio="none" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAdCAYAAABWk2cPAAAAAXNSR0IB2cksfwAAAAlwSFlzAAAOxAAADsQBlSsOGwAAAm5JREFUSInt1juIVUccx/HP7Ipi1C1ECxNQECsN9nYqoo2BTZPsrmipRTQQJcXaaOMDZRUfRVxIkWb3Jo2NpewqSEgtighpdvFRZLUQQ5p4x2Lmrsdzz7mP3cLGH/zhzOt8Z+b/n//MCp9AKz5Di4psxnfYg53YgAH8g8e4i+nAs2VDI5sj5zGCwYouX2XbjwtNpgKnu8FroTGBbgWGuk49aTBwGMORo4FGX9DIT6+Y2EDoEbio26wbZjryZeBKT9C8wolHhL240QfwOWYxnIoTkRdVK/4ImgPmFsJ9/IDtfUC3YRxnsTJVTUYelH1chl4IDP2La3jaB1AGjUqEralqXQ7EI5XQyBZpaz3Bz9K56Fe78PcHqMBYLEV0caUj0tnzFw4uAUhyxy/SGcoalDbgchV0T+tjBieWCIVv26v21UG/bn38vwxgzfgdxUIR+pELL+F7NPGbFJGdNCm5ZAa/tzdvrIMuajV+xKpcPtkDdAxr8kTvtDc366ALUh5t6xW7AOFdYVyzvXmhDvqoBf1P8vqID9vbTb9KmWgmjy/pYR30Hg60Cmey9aqT2eCb9ubZOug0zmGgIfmnqLcdgGtL5VKyfYc/KqGBuSaNwNgXFT8uT6KTiuMjjQHmK6EZPC5F/tB6vM7167tAOvR9Ezhd7l+GzkeOYeom4Xiuv9kFel06YqW+EcdCaZVt0AxuRDaNMjHa4yV+KFtBEafqXg+VySFwNfJSult7fa609EZaYX/PlQxuRP7Md+ziDdRBzZgCcbxqS3uCZvA8DsUUDKPYLV0MrTy9ICWVWSlK57pMrDu0AJ/DxWzL1id54b8HE02PRtYIss0AAAAASUVORK5CYII=" transform="matrix(1.00000000,0.00000000,0.00000000,1.00000000,15.00000000,15.00000000)"></image>

In IE8 or 9 is:
<rect style="left: 367px; top: 456px; width: 28px; height: 28px;">
<imagedata/>

Without securing the service the images are shown.
In IE8 or 9 is:
<rect style="left: 0px; top: 0px; width: 29px; height: 29px;" unselectable="on">
<imagedata unselectable="on"/>

Cheers,
José

dimesv

Hi,

The FeatureLayer does not have any method like that.

This behaviour is strange because using the proxy page with Google Chrome it works just fine. Using the url "http://localhost/...../MapServer/0" as an ArcGISDynamicMapService works both in IE8 (or 9) and Chrome.

Just when I use the url as an FeatureLayer is that IE8 and 9 cannot show the picture.

If I use the MapServer without being secured it works just fine ...

In Javascript init method the proxy is registered as:

esri.config.defaults.io.proxyUrl = 'myproxypageurl';
esri.config.defaults.io.alwaysUseProxy = true;

Hope Esri Inc. gives me a little help on this.

José

HemingZhu

Dear ArcGIS Javascript API Team,

I have configured a secured MapService with a single layer (Picture Marker Symbol) using the proxy page from Esri.

I have configured everything as told on the Javascript documentation about the proxy and if I use the mapservice as an ArcGISDynamicMapService it works fine and the proxy is triggered correctly.

When I create a FeatureLayer pointing to the map service layer and add it to the map, I have realized that Internet Explorer 8 or 9 cannot show the images (Base64). The proxy page is being triggered and I believe is missing something in the response code.

Google Chrome shows perfectly well all symbology.

Can please someone provide me guidance on this?

Cheers,
José Sousa

Try to change your image format before add your featurelayer somthing like yourFeatureLayer.setImageFormat("png24"). It might do the trick, please let me konw if it works.

dimesv

Hi all,

If it is needed I can place here the proxy page. But I can assure it is equal to the one provided by Esri.

Cheers,
José

Únete a la Conversación

Los miembros registrados pueden publicar, seguir actualizaciones y más. ¿Nuevo aquí? Regístrate gratis.

Enlaces Rápidos

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