Working through conversion from KML to SVG using XSLT - Steps break-down

This post describes each step to convert the original KML file, s1-Coords.kml, to the result SVG file, s4-path.xml.svg. Each step has an intermediate file. (Intermediate files are useful for the testing stage, so that the algorithm can build up from small. At the end, the best would be only saving the END result.)

Start with the original file:

s1-Coords.kml
****************************************************************

<?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>
<Folder>
<name>monde</name>
<open>1</open>
<Placemark>
<name>Sans titre - Trajet</name>
<styleUrl>#msn_ylw-pushpin00</styleUrl>
<LineString>
<tessellate>1</tessellate>
<coordinates>
2.328735169173783,50.99098347661589,0 1.939879599846932,50.95290354479823,0 6.07608623537034,46.38762461012988,0 6.102492885944002,46.5201900839377,0 6.356917438465915,49.47921006175431,0 4.176723982212366,50.03964519363036,0 2.464975417093001,51.00349748471994,0  </coordinates>
</LineString>
</Placemark>
</Folder>

  </Document>
</kml>

****************************************************************

Step 1: Extract all coordinates and split them to be point by point


s1-Coords.xml

****************************************************************

<?xml version="1.0" encoding="UTF-8"?>

<coords>

<point>

2.328735169173783,50.99098347661589,0</point>

<point>1.939879599846932,50.95290354479823,0</point>

<point>6.07608623537034,46.38762461012988,0</point>

<point>6.102492885944002,46.5201900839377,0</point>

<point>6.356917438465915,49.47921006175431,0</point>

<point>4.176723982212366,50.03964519363036,0</point>

<point>2.464975417093001,51.00349748471994,0</point>

</coords>

****************************************************************

Step 2: Split coordinates in each point to be longitude and latitude. 

Delete 0s, as svg is 2D. (Later, may keep the Zs for 3D objects in KML, but only parse 2D coordinates to SVG)

s2-Coords.xml

****************************************************************

<?xml version="1.0" encoding="UTF-8"?>

<coords>

<point>

<longitude>

2.328735169173783</longitude>

<latitude>50.99098347661589</latitude>

</point>

<point>

<longitude>1.939879599846932</longitude>

<latitude>50.95290354479823</latitude>

</point>

<point>

<longitude>6.07608623537034</longitude>

<latitude>46.38762461012988</latitude>

</point>

<point>

<longitude>6.102492885944002</longitude>

<latitude>46.5201900839377</latitude>

</point>

<point>

<longitude>6.356917438465915</longitude>

<latitude>49.47921006175431</latitude>

</point>

<point>

<longitude>4.176723982212366</longitude>

<latitude>50.03964519363036</latitude>

</point>

<point>

<longitude>2.464975417093001</longitude>

<latitude>51.00349748471994</latitude>

</point>

</coords>

****************************************************************

Step 3: Convert longitude and latitude to be x and y

s3-Coords.xml

****************************************************************

<?xml version="1.0" encoding="UTF-8"?>

<coords>

<point>

<x>0.040644095415756136</x>

<y>0.8899605353158819</y>

</point>

<point>

<x>0.03385728553205602</x>

<y>0.889295915138066</y>

</point>

<point>

<x>0.10604770863334066</x>

<y>0.809616767815344</y>

</point>

<point>

<x>0.10650859162241291</x>

<y>0.8119304717682893</y>

</point>

<point>

<x>0.11094913768608598</x>

<y>0.863575112132516</y>

</point>

<point>

<x>0.07289758419311611</x>

<y>0.8733565502607484</y>

</point>

<point>

<x>0.04302193627511825</x>

<y>0.8901789459561932</y>

</point>

</coords>

****************************************************************

Step 4: Form result SVG file.

Write x and y for each point in the above xml to the path object in SVG

s4-path.xml.svg

****************************************************************

<?xml version="1.0" encoding="UTF-8"?>

<svg xmlns="http://www.w3.org/2000/svg"

    width="20"

    height="20"

>

<path style="fill:none;fill-rule:evenodd;stroke:#000000;stroke-width:0.5;stroke-opacity:1.0" d="M 0.040644095415756136 0.8899605353158819 L 0.03385728553205602 0.889295915138066 L 0.10604770863334066 0.809616767815344 L 0.10650859162241291 0.8119304717682893 L 0.11094913768608598 0.863575112132516 L 0.07289758419311611 0.8733565502607484 L 0.04302193627511825 0.8901789459561932 L "/>

</svg>

****************************************************************