I am loading a KML file via Google Map's V3 API. The colors in the KML file are being used but I would like to override it with my own color. I actually want to use a solid color for the whole trace. Is there a way to do this?

I am loading a KML file via Google Map's V3 API. The colors in the KML file are being used but I would like to override it with my own color. I actually want to use a solid color for the whole trace. Is there a way to do this?

• javascript
• google-maps
• google-maps-api-3
• kml

3 Answers 3

KML colors are based on Style^api-doc tags that are defined either directly in the KML or using a reference to an external KML style file (similar to CSS). We use an external style file, so that the styles may be applied to multiple KML files.

This means that within our KML data files, you will find entries such as this:

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://earth.google.com/kml/2.2">
<Document>
    <name>Country Borders</name>
    <open>1</open>
    <Placemark>
        <name>Russian Federation</name>
        <styleUrl>kml-styles.kml#red</styleUrl>
--- etc. ---

The styleUrl tag above essentially says: go look in the file: kml-styles.kml and find the style named: red.

And within the our KML style file, you will find entries such as this:

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://earth.google.com/kml/2.2">
<Document>
    <name>KML Styles</name>
    <open>1</open>
    <Style id="red">
        <LineStyle>
            <color>7da00000</color>
            <width>1</width>
        </LineStyle>
        <PolyStyle>
            <color>7f0000ff</color>
        </PolyStyle>
    </Style>
    <Style id="green">
        <LineStyle>
            <color>FFFF00</color>
            <width>1</width>
        </LineStyle>
        <PolyStyle>
            <color>7f00aa00</color>
        </PolyStyle>
    </Style>
    --- etc. ---

It's important to note that KML color^api-doc definitions include eight hex digits within their definition; two more digits than what is customary for other color definitions, because the first two hex digits define the color opacity (alpha).

The example at the KML Style^api-doc (same as the link at the top), also shows how styles may be defined directly within the KML file that contains the data.

KML colors work like so,

<color>AABBGGRR</color>
AA = alpha opacity
BB = blue
GG = gren
RR = red

The range is from 00 -> ff

RGB for white = 255, 255, 255, hex -> #ffffff

RGB for yellow is 255,255,0, hex -> #ffff00

Hex can also been seen as

#RRGGBB

You can easily move the colors around to work for KML

so yellow in KML would be

<color>ff00FFFF</color>
<color>AABBGGRR</color>

This has been working for me.

Also, for borders use below.

<outline>1</outline>

https://developers.google.com/kml/documentation/kmlreference

KML is XML, so you'd use XSL (yeah, me neither) or PHP or (depending on the specifics) JavaScript to parse / transform / re-serialize back to KML.