0

I want to render a KML file in google maps from my asp.net MVC 3 app.

From Google Maps JavaScript API V3, I'm using KmlLayer('url') to render the kml in google maps. I have read that kml file needs to be in a publicly accessible server. I could render the kml file locally with third party javascripts but they can be prone to errors. (Loading a local .kml file using google maps?)

The kml files I want to render are stored in a SQL server database as byte arrays. So for one Kml file I have to write the byte array into a path with kml extension. I have done this with File.WriteAllBytes(path, byte), where path = local path and byte = byte array from Database. THis is done in the Controller of MVC app. This is the code:

public ActionResult MapView(int id)
        {
          Incident inc = db.Incidents.Find(id);
            if (inc.IncidentDatas.Count != 0)
            {
                ViewBag.ListKmlUrls = kmlFileStore(inc);
            }

            return View(inc);
        }

public List<string> kmlFileStore(Incident inc)
        {
            List<string> listKmlUrls = new List<string>();
            // Specify a "currently active folder"
            string activeDir = @"c:\incident" + inc.incId + @"\incidentData";

            //Create a new subfolder under the current active folder
            string newPath = System.IO.Path.Combine(activeDir, "kmlFiles");

            // Create the subfolder
            System.IO.Directory.CreateDirectory(newPath);

            String url;
            foreach(var d in inc.IncidentDatas) {
                url = @"c:\incident" + inc.incId + @"\incidentData\kmlFiles\" + d.id + ".kml";

                 //dataContent is byte[]
                System.IO.File.WriteAllBytes(url, d.dataContent);
                listKmlUrls.Add(url);
            }

            return listKmlUrls;
        }

The idea is the view will access the list of urls through viewbag to pass urls to javascript method KmlLayer(...). But the urls here are only local paths.

So how can the MVC app store the kml file to a publicly accessible server so that it can pass a url to KmlLayer(...)? This would have to be done programmatically.

I'm currently accessing my MVC app and database from localhost. I have a static Ip and name. I would also like to publish the app and database for online access. Not sure how to proceed, please give me some advice/guidance. Thanks.

Community
  • 1
  • 1
Qwerty
  • 323
  • 1
  • 6
  • 33

1 Answers1

0

There are some problem to make kml file publicly accessible. Say the file location must be accessible by google.

If you want to embed Google Earth in website then there are three methods of importing KML into the plugin. 1. KmlNetworkLink 2. fetchKml 3. ParseKml

Both 1 & 2 need kml file stored in server that must publicly accessible but 3. ParseKml works better way.

<head>
    <title>parsekml_example.html</title>
    <script src="//www.google.com/jsapi?key=ABQIAAAA5El50zA4PeDTEMlv-sXFfRSsTL4WIgxhMZ0ZK_kHjwHeQuOD4xTdBhxbkZWuzyYTVeclkwYHpb17ZQ"></script>
    <script type="text/javascript">
        var ge;
        var placemark;
        var object;

        google.load("earth", "1");

        function init() {
            google.earth.createInstance('map3d', initCB, failureCB);
        }

        function initCB(instance) {
            ge = instance;
            ge.getWindow().setVisibility(true);
            var kmlString = ''
                         + '<?xml version="1.0" encoding="UTF-8"?>'
                         + '<kml xmlns="http://www.opengis.net/kml/2.2">'

                         + '<Document>'
                         + '  <Camera>'
                         + '    <longitude>-122.444633</longitude>'
                         + '    <latitude>37.801899</latitude>'
                         + '    <altitude>139.629438</altitude>'
                         + '    <heading>-70.0</heading>'
                         + '    <tilt>75</tilt>'
                         + '  </Camera>'

                         + '  <Placemark>'
                         + '    <name>Placemark from KML string</name>'
                         + '    <Point>'
                         + '      <coordinates>-122.448425,37.802907,0</coordinates>'
                         + '    </Point>'
                         + '  </Placemark>'

                         + '</Document>'
                         + '</kml>';

            var kmlObject = ge.parseKml(kmlString);
            ge.getFeatures().appendChild(kmlObject);
            ge.getView().setAbstractView(kmlObject.getAbstractView());
        }

        function failureCB(errorCode) {
        }

        google.setOnLoadCallback(init);
    </script>  
</head>
<body>
    <div id="map3d" style="height: 400px; width: 600px;">

    </div>   
</body>

For more detail see http://code.google.com/apis/earth/documentation/kml.html

Shahdat
  • 5,343
  • 4
  • 37
  • 37
  • Ok, but I want to embed Google Maps instead. The MVC app needs to show a simple road map that renders kml file. I'm not sure if open layer has a local rendering KmlLayer method. With google earth the rendering of map is slower and also it needs a google earth plugin. Users who access the MVC app on their browser may not have the plugin ready... – Qwerty Jan 24 '12 at 19:24
  • I read about using Server.MapPath("~/folder"). But not sure how I can store the kml file in a web server and get the url of where it is stored...I don't want the KML to be stored in the user's system accessing the MVC app. – Qwerty Jan 24 '12 at 21:34
  • It should be simple. Based on your geographic information create kml file by 'System.IO.File.WriteAllText(path, contents)`. To read you can try this 'StreamReader file = new StreamReader(filePath); var kml = file.ReadToEnd();` – Shahdat Jan 25 '12 at 07:01