Color in KML is all wrong!

I am working on building a Widget for the ESRI Flex Viewer that will import KML files from Google Earth. It is pretty easy to do, they already have a widget which imports GeoRSS feeds and Google has sample Flex Code for importing KML files into a Flex Google Maps viewer. The real work is turning the structures the Google parser builds into Graphic Objects which the ESRI Flex Viewer can take. Not exactly rocket science, but it has taken a lot of detective work because some aspects are less than obvious.

A real head scratcher for me was getting the colors right. All of the KML files I imported would have some of their colors off. I took me a while to figure out that color are not encoded in a standard way in KML files. Color in KML files are encoded using Hex, similar to HTML, except they also include an Alpha channel. Each Channel (red, green, blue & alpha) are given 32 bits (0-255), which is converted into two Hexadecimal characters (0 – F). All this is pretty standard. The difference is that the Channels in KML colors are written down in a different order than almost every other standard. The order of the channels in KML is Alpha-Blue-Green-Red (ABGR) as opposed to the standard Alpha-Red-Green-Blue (ARGB). Flash takes in an integer conversion from the hex format, which is easy to do. The problem is that it expects the hex channels to be encoded in the RGB order. Once I figured this out I was able to put together a pretty simple encoder/converter. It may not be pretty but it gets the job done!

private function setKmlColor(kmlColor:String)


var abgr:uint = parseInt(kmlColor,16);

var alphaUint:uint =(abgr>> 24) & 0xFF;

var blueUint:uint = (abgr >> 16) & 0xFF;

var greenUint:uint = (abgr >> 8) & 0xFF;

var redUint:uint = abgr & 0xFF;

var colorUint = (redUint << 16);

colorUint += (greenUint << 8);

colorUint += (blueUint);

this._color = colorUint;

this._alpha = alphaUint / 255;







3 responses to “Color in KML is all wrong!”

  1. Kimberly Martin Avatar
    Kimberly Martin

    Hi Luke,

    This widget sounds great! I have so many KML files that I’d like to load into my flex app. When will the widget be ready? Can I possibly get an advanced copy :)


  2. admin Avatar

    Hi Kimberly,
    I should have a version ready by the end of this week that you can try out. I have found that KML files can be encoded a number of different ways so it will be helpful if you could give it a try and see if it works.

    – Luke

  3. Don Avatar

    Do you have a widget for Version 2.x of the ESRI Flexviewer. .swf file and sample xml, sample coding in the config.xml would be helpful too. I have been looking all over for a widget that will bring in kml files.