Displaying Dynamic KML with ASP.NET

by Idaho Web Designer 22. June 2009 20:06

Backcountry Secrets wanted to display KML files for each of their points on their maps.  I didn't want to store all of the KML files on my server, but I wanted to store them in a MySQL database.  The first step was to get the KML file uploaded to the server.  Here's my code I used:

protected void cmdUpload_Click(object sender, EventArgs e)
        MySqlConnection conn = new MySqlConnection(ConfigurationManager.ConnectionStrings["MySQLConnectionString"].ToString());
        MySqlCommand cmd = conn.CreateCommand();

        Stream imageStream = uploadKMLFile.PostedFile.InputStream;
        TextReader t = new StreamReader(imageStream);

        string kmlText = t.ReadToEnd();

        //Insert KML string to the database
        cmd.CommandText = "INSERT INTO kmlfilestable (kmlstring) " +
                            "VALUES (?KML)";

        cmd.Parameters.Add("?KML", MySqlDbType.Text);
        cmd.Parameters["?KML"].Value = kmlText;


        lblUploadSuccess.Text = "Thank you for uploading this KML. We will now review for approval.";


After successfully getting the KML string in to the database my next task was to get it to show up on the map for each point.  I built a webhandler (.ashx file) to handle requests for the KML string that dynamically generates the KML file structure. 

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

using System;
using System.IO;
using System.Web;
using System.Text;
using System.Data;
using System.Configuration;
using MySql.Data.MySqlClient;

public class displayKml : IHttpHandler {
    public void ProcessRequest (HttpContext context) {
        string intPointID = context.Request.QueryString["pointid"];

        MySqlConnection conn = new MySqlConnection(ConfigurationManager.ConnectionStrings["backcountryMySQL"].ToString());
        MySqlCommand cmd = conn.CreateCommand();
        string strKML = "";

        cmd.CommandText = "SELECT kmlstring FROM kml WHERE fkpointid = ?PointID";

            cmd.Parameters.Add("?PointID", MySqlDbType.Int32);
            cmd.Parameters["?PointID"].Value = intPointID;
            strKML = cmd.ExecuteScalar().ToString();

            //Download the KML file to client
            context.Response.ContentType = "text/xml";
            context.Response.AppendHeader("Content-Disposition", "attachment; filename=" + intPointID + ".kml");
            context.Response.ContentEncoding = System.Text.Encoding.UTF8;
            byte[] byteArray = Encoding.ASCII.GetBytes(strKML);

    public bool IsReusable {
        get {
            return false;


Finally on the page that displays the google map and kml file I included a request to the webhandler to display the file in the initialization of the Google Map.

 <script type="text/javascript">
        function initialize() {
            if (GBrowserIsCompatible()) {
                var strLat = <%=strLat %>;
                var strLon = <%=strLon %>;

                var map = new GMap2(document.getElementById("map_canvas"));

                //Zoom to the point
                var point = new GLatLng(strLat, strLon);
                if (<%=strShowMap %> == '0') //User does not have access to the map.
                    var zoomLevel = 1;
                    map.setCenter(point, zoomLevel);
                else //Show the map and KML file
                    //View the KML
                    url_end = "?nocache=" + (new Date()).valueOf(); 
                    var geoxml = new GGeoXml("http://www.backcountrysecrets.com/displayKml.ashx?kmlstring=<%=kmlID %>");


Tags: , , ,

MySQL | ASP.NET | KML | Google Maps