KML output

HTML

<script src="//maps.google.com/maps/api/js?sensor=false"></script>
<script src="http://app.essoduke.org/tinyMap/jquery.tinyMap-3.0.0.min.js?ver=3.0.0"></script>
<p>Right click on map to create the marker</p>
<button id="KML">getKML</button>
<button id="polyline">Draw</button>
<div id="output"></div>
<div id="map"></div>

CSS

#map{width:100%;height:360px}
#output{display:none;background:f0f0f0;width:100%;height:400px;overflow:auto}

JavaScript

var map = $('#map');

map.tinyMap({
    'center': ['23.947454', '121.578179'],
    'zoom': 13,
    'event': {
        'rightclick': function (loc) {            
            map.tinyMap('modify', {
                'marker': [
                    {
                        'addr': [loc.latLng.lat(), loc.latLng.lng()]
                    }
                ]
            });            
        }
    }
});

$('#polyline').click(function(){
    var instance = map.data("tinyMap");
    var markers = instance._markers;

    map.tinyMap("clear", "direction");

    for (i = 0; i < markers.length; i++) {
        if (i < markers.length - 1) {
          map.tinyMap("modify", {
        "direction": [
            {
                "from": markers[i].addr,
                "to": markers[i+1].addr
            }
        ]
    });
        }
    }
});

$('#KML').on('click', function () {
    var kml = map.tinyMap('getKML');  
    $('#output').text(kml).show();
});