Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

I'm trying to create, edit and save a point vector as kml file in an Openlayers app. I have managed the create and edit by adding and empty vector layer and then adding the control

OpenLayers.Control.EditingToolbar("name of the layer")

But how could I save/export this afterwards in kml format? I just need this on the browser side a popup to let me save the file locally not on the server side.

Thanks Aris

share|improve this question

2 Answers 2

OpenLayers.Format.KML will allow you to get all your features as a KML string.

like so:

Save as string:

function GetKMLFromFeatures(features) {
    var format = new OpenLayers.Format.KML({
        'maxDepth':10,
        'extractStyles':true,
        'internalProjection': map.baseLayer.projection,
        'externalProjection': new OpenLayers.Projection("EPSG:4326")
    });

    return format.write(features);
}

Download the string:

But if what you actually want is to download a KML file of the string, you will face the issue that the KML string already resides on the client's browser so you can't download it because it's already there. To Download it you'll have to send it back to a handler on the server side to return a response with the proper file extension and content type application/kml;

This will initiate a browser download.

Check my more indepth answer on StackOverflow.

Update:

A comment on SO pointed me to a new way of doing this. Though, make sure browser compatibility is appropriate.

share|improve this answer

@CaptDragon solution is right to generate kml file from features. if you want to save it client side, there is a tiny javascript + Flash library here. and very good example here, only one thing is that change data name to *.kml.

and the sample code with @CaptDragon's code and Downloadify:

<script type="text/javascript">
    function GetKMLFromFeatures(features) {
        var format = new OpenLayers.Format.KML({
            'maxDepth':10,
            'extractStyles':true,
            'internalProjection': map.baseLayer.projection,
            'externalProjection': new OpenLayers.Projection("EPSG:4326")
        });

    return format.write(features);
}

Downloadify.create('downloadify',{
filename: function(){
  return document.getElementById('filename').value + '.kml';
},
data: function(){ 
  return GetKMLFromFeatures(features);
},
onComplete: function(){ 
  alert('Your File Has Been Saved!'); 
},
onCancel: function(){ 
  alert('You have cancelled the saving of this file.');
},
onError: function(){ 
  alert('You must put something in the File Contents or there will be nothing to save!'); 
},
transparent: false,
swf: 'media/downloadify.swf',
downloadImage: 'images/download.png',
width: 100,
height: 30,
transparent: true,
append: false
 });
</script>

i hope it helps you...

share|improve this answer
    
Nice to see there is a different solution though I don't particularly like that it relies on flash. (+1) –  CaptDragon Jun 21 '12 at 15:51
    
the basis of function relies on flash but i have been solving lots of problem when need client side... –  Aragon Jun 21 '12 at 16:34
    
Thanks for the answer. I find this very handy but it might not be a food idea to use flash. In fact I was thinking would it be easier if i make a vector file on the server side serve it with geoserver and the user will have the option to edit it save it on the server side and then download it from there. But then again I know how to do the edit and save on server side but downloading it locally is an issue. –  ardms Jun 22 '12 at 7:07

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.