javascript - Openlayers 根据您的 map 编写并保存 KML

Question

是否可以从 OpenLayers 编写和保存 KML？有人知道导出一个的例子吗？

Answer 1

您只能将矢量要素导出到 KML。

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);
}

---

更新

为了强制浏览器将 KML 字符串下载为 KML 文件，您需要将该字符串发送回服务器端，以便它可以作为文件返回到浏览器以供下载。

您还没有指定您在服务器端使用的语言/平台/等但这是我在 C# 中所做的。

我创建了一个处理程序，它接收来自查询字符串的文件名和来自文本区域表单的 KML。

KMLDownload.ashx:

<%@ WebHandler Language="C#" Class="KMLDownload" %>

using System;
using System.Web;

public class KMLDownload : IHttpHandler
{

    public void ProcessRequest(HttpContext context)
    {


        HttpResponse response = context.Response;

        string kml = context.Request["kml"];
        string filename = context.Request.QueryString["filename"];

        if (String.IsNullOrEmpty(kml))
        {
            context.Response.ContentType = "text/plain";
            context.Response.Write("{\"error\":\"No files recevied\"}");
        }
        else
        {

            if (String.IsNullOrEmpty(filename)){
                filename = "Features_KML.kml";
            }

            // force a download of the kml file.
            response.Clear();
            response.ContentType = "application/kml";
            response.AddHeader("Content-Disposition", "attachment; filename=" + filename);
            response.AddHeader("content-legth", kml.Length.ToString());
            response.Write(kml.ToString());
            response.End();
        }

    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }

}

然后从我的 javascript 端我简单地调用它来启动下载:

var filename = "NameofKMLfileI_WANT.kml";

var url = "secure/KMLDownload.ashx";
if (filename) {
    url += "?filename=" + filename;
}

var input = '<TEXTAREA name="kml">' + kml + '</TEXTAREA>';

//send request
jQuery('<form action="' + url + '" method="post">' + input + '</form>').appendTo('body').submit().remove();