CODEWITHSUNDEEP
kmlgoogle-earthgoogle-earth-plugin
hash__x
hash__x

Reputation: 83

How to parse KML file to Google Earth API on my website?

I have created a KML file and want to present it on Google Earth API on my website. I have browsed the Google code playground

but I don't know which one should I use to parse KML to the Google Earth API. This is the link of the KML file I've created: http://g.co/maps/6zp5a

Can anyone help please?

Upvotes: 0

Views: 3953

Answers (2)

jwilliams
jwilliams

Reputation: 11

Below is "Hello Earth" demo with the fetch function for your kml. You will most likely have to style the icons in your kml to utilize the blue paddles.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <head>
<!--
Copyright 2008 Google Inc.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

     http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
    <title>Hello Google Earth!</title>
    <script src="http://www.google.com/jsapi"></script>
    <script>
google.load("earth", "1");

var ge = null;

function init() {
  google.earth.createInstance("map3d", initCallback, failureCallback);
}

function initCallback(object) {
  ge = object;
  ge.getWindow().setVisibility(true);
  function finished(object) {
    if (!object) {
      // wrap alerts in API callbacks and event handlers
      // in a setTimeout to prevent deadlock in some browsers
      setTimeout(function() {
        alert('Bad or null KML.');
      }, 0);
      return;
    }
    ge.getFeatures().appendChild(object);
  }
  // fetch the KML
  var url = 'http://maps.google.com/maps/ms?ie=UTF8&authuser=0&msa=0&output=kml&msid=201182140457027399871.0004bee0c7348bce68977';
  google.earth.fetchKml(ge, url, finished);

  document.getElementById('installed-plugin-version').innerHTML =
    ge.getPluginVersion().toString();
}

function failureCallback(errorCode) {
}
  </script>
  </head>
  <body onload='init()' id='body'>
    <center>
      <div>
        Hello, Earth!
      </div>
      <div id='map3d' align="left" style='border: 1px solid silver; height: 600px; width: 800px;'></div>
    </center>
  </body>
</html>

Upvotes: 1

lifeIsGood
lifeIsGood

Reputation: 1229

You should use fetchKml instead.

http://code.google.com/apis/ajax/playground/?exp=earth#fetch_good_kml

You also need to provide valid url, so instead of your 'short' url, you need to use the full one, and add '&output=kml' to the end

http://maps.google.com/maps/ms?msid=201182140457027399871.0004bee0c7348bce68977&msa=0&ll=9.438,39.5105&spn=130.55749,316.054688&output=kml

put that url into the sample code page and run it, it works

Upvotes: 1

Related Questions