Skip to content

Improve KML with style sheets with richer icons and style map #55

Description

@D-Jeffrey

Currently the KML produced is heavy with styles applied to each item. Need to move the styling to style maps.

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2"
     xmlns:gx="http://www.google.com/kml/ext/2.2"
     xmlns:kml="http://www.opengis.net/kml/2.2"
     xmlns:atom="http://www.w3.org/2005/Atom" >
  <Document>
    <name>Jim Family Events</name>
    <!-- Cascading styles: normal/highlight per event type -->

    <Style id="baby-normal">
      <IconStyle>
        <scale>1.1</scale>
        <Icon>
          <href>https://earth.google.com/earth/document/icon?color=0f00ff&amp;id=2023&amp;scale=1</href>
        </Icon>
      </IconStyle>
    </Style>
    <Style id="baby-highlight">
      <IconStyle>
        <scale>1.4</scale>
        <Icon>
          <href>https://earth.google.com/earth/document/icon?color=0f04ff&amp;id=2266&amp;scale=1</href>
        </Icon>
      </IconStyle>
    </Style>
    <StyleMap id="baby">
      <Pair>
        <key>normal</key>
        <styleUrl>#baby-normal</styleUrl>
      </Pair>
      <Pair>
        <key>highlight</key>
        <styleUrl>#baby-highlight</styleUrl>
      </Pair>
    </StyleMap>
    <!-- Death black cross -->
    <Style id="death-normal"> 
      <IconStyle>
        <scale>1.1</scale>
        <Icon>
          <href>https://earth.google.com/earth/document/icon?color=000000&amp;id=2282&amp;scale=1</href>
        </Icon>
      </IconStyle>
    </Style>
    <Style id="death-highlight">
      <IconStyle>
        <scale>1.4</scale>
        <Icon>
          <href>https://earth.google.com/earth/document/icon?color=000000&amp;id=2282&amp;scale=1</href>
        </Icon>
      </IconStyle>
    </Style>
    <StyleMap id="death">
      <Pair>
        <key>normal</key>
        <styleUrl>#death-normal</styleUrl>
      </Pair>
      <Pair>
        <key>highlight</key>
        <styleUrl>#death-highlight</styleUrl>
      </Pair>
    </StyleMap>
    <!-- Marriage red ring -->
    <Style id="marriage-normal"> 
      <IconStyle>
        <scale>1.1</scale>
        <Icon>
          <href>https://earth.google.com/earth/document/icon?color=ff0000&amp;id=2189&amp;scale=1</href>
        </Icon>
      </IconStyle>
    </Style>
    <Style id="marriage-highlight">
      <IconStyle>
        <scale>1.4</scale>
        <Icon>
          <href>https://earth.google.com/earth/document/icon?color=ff0000&amp;id=2189&amp;scale=1</href>
        </Icon>
      </IconStyle>
    </Style>
    <StyleMap id="marriage">
      <Pair>
        <key>normal</key>
        <styleUrl>#marriage-normal</styleUrl>
      </Pair>
      <Pair>
        <key>highlight</key>
        <styleUrl>#marriage-highlight</styleUrl>
      </Pair>
    </StyleMap>

    <!-- Repeat for marriage, home, ship, cross with different icons -->


    <!-- Example polyline style -->
    <Style id="life-line">
      <LineStyle>
        <color>ff7fffff</color> <!-- yellow, ABGR -->
        <width>2</width>
      </LineStyle>
    </Style>

    <Folder>
      <name>William Shakespeare</name>

      <!-- Birth -->
      <Placemark>
        <name>Birth of William Jim</name>
        <styleUrl>#baby</styleUrl>
        <TimeStamp>
          <when>01-01-1564</when>
        </TimeStamp>
        <Point>
          <coordinates>-1.708,51.191,0</coordinates>
        </Point>
      </Placemark>

      <!-- Marriage -->
      <Placemark>
        <name>Marriage to Anne Heart</name>
        <styleUrl>#marriage</styleUrl>
        <TimeStamp>
          <when>01-01-1582</when>
        </TimeStamp>
        <Point>
          <coordinates>-1.708,52.191,0</coordinates>
        </Point>
      </Placemark>

      <!-- Death -->
      <Placemark>
        <name>Death of William Jim</name>
        <styleUrl>#death</styleUrl>
        <TimeStamp>
          <when>01-01-1616</when>
        </TimeStamp>
        <Point>
          <coordinates>-2.708,52.191,0</coordinates>
        </Point>
      </Placemark>

      <!-- Polyline connecting events in order -->
      <Placemark>
        <name>Life path</name>
        <styleUrl>#life-line</styleUrl>
        <LineString>
          <tessellate>1</tessellate>
          <coordinates>
            -1.708,51.191,0
            -1.708,52.191,0
            -2.708,52.191,0
          </coordinates>
        </LineString>
      </Placemark>

    </Folder>
</Document>
</kml>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions