none
Ajax Control 7.0 - Polygons have no color in IE8 RRS feed

  • Question

  • I've found out that the polygons I'm drawing are not handling color properly. The shapes are being drawn, but they are being filled in white and have what seems to be the default red outline. 

     

    shapePoints = new Array();
    for(var i in points) {
    	var point = new Microsoft.Maps.Location(points[i][0], points[i][1]);
    	shapePoints.push(point);
    }
    		
    var msColor = Microsoft.Maps.Color.fromHex(color);
    msColor.a = 200;
    var polygon = new Microsoft.Maps.Polygon(shapePoints, { fillColor: msColor, strokeThickness:0});	
    map.entities.push(polygon);
    

     


    In IE8 it looks like for every polygon it is throwing a "Failed" error for veapicore.js script

     

    Seems to be fillColor related. If I set the strokeColor, the appropriate color is showing. 
    • Moved by Ricky_Brundritt Saturday, March 10, 2012 10:25 AM (From:Bing Maps: Map Control and Web services Development)
    Wednesday, August 3, 2011 2:01 PM

Answers

  • Finally figured it out. Figured I'd post what the problem was for anyone else that possibly could end up running into this problem.

    I was using a htc file for box shadow and other css3 type effects in IE. (ie-css3.htc) Getting rid of the behavior reference to this in my stylesheets solved the issue.

    • Marked as answer by pgm8705 Thursday, August 4, 2011 1:06 PM
    Thursday, August 4, 2011 1:05 PM

All replies

  • Sorry, it turns out that the errors aren't related. So now it seems like polygons in IE8 will only fill in white regardless of what fillColor is set to. 

    I even tested just a basic square taken directly from the microsoft docs...

     

     

    var location1 = new Microsoft.Maps.Location(20,-20);
          var location2 = new Microsoft.Maps.Location(20,20);
          var location3 = new Microsoft.Maps.Location(-20,20);
          var location4 = new Microsoft.Maps.Location(-20,-20);
    
    
          // Create a polygon 
          var vertices = new Array(location1, location2, location3, location4, location1);
          var polygon = new Microsoft.Maps.Polygon(vertices,
                   {fillColor: new Microsoft.Maps.Color(100,100,0,100), 
                    strokeColor: new Microsoft.Maps.Color(200,0,100,100),
                    strokeThickness: 5});
    
          
          // Add the shape to the map
          map.entities.push(polygon)
    
          // Set the view
          map.setView({bounds: Microsoft.Maps.LocationRect.fromLocations(vertices)});
    

     

    Anyone else ever experience this? Is it possible you simply can't do fill colors in IE8?

    Wednesday, August 3, 2011 6:41 PM
  • Could you try http://www.bingmapsportal.com/ISDK/AjaxV7#Shapes8 on IE8, the example set random fill & stoke colors and it fines for me on IE8?
    MSFT
    Hemant Goyal
    Thursday, August 4, 2011 1:04 AM
  • Yes, that works fine for me too. It must be something in my stack causing a conflict. Jquery perhaps... 
    Thursday, August 4, 2011 12:53 PM
  • Finally figured it out. Figured I'd post what the problem was for anyone else that possibly could end up running into this problem.

    I was using a htc file for box shadow and other css3 type effects in IE. (ie-css3.htc) Getting rid of the behavior reference to this in my stylesheets solved the issue.

    • Marked as answer by pgm8705 Thursday, August 4, 2011 1:06 PM
    Thursday, August 4, 2011 1:05 PM