[Geoserver-users] Adding a Geoserver KML to a Google Maps control

Clark_Woodward · August 8, 2008, 1:28pm

I am trying to directly integrate Geoserver with a web page containing a
Google Maps control. However serving a KML from Geoserver into a Google Maps
control seems to fail. Is there a way to overcome this? Sample code below.

Should Geoserver be able to server KMLs into a Google Maps control?

Thanks in advance.

Clark

CODE SAMPLE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"

xmlns:v="urn:schemas-microsoft-com:vml">

<head>

<title>Google Maps API Example: GGeoXml KML Overlay</title>

type="text/javascript"></script>

var map;

var geoXml;

var toggleState = 1;

function initialize() {

if (GBrowserIsCompatible()) {

geoXml = new
GGeoXml("http://localhost:8080/geoserver/wms/kml_reflect?layers=tiger:tiger_
roads");

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

map.addControl(new GLargeMapControl());

map.addOverlay(geoXml);

}

function toggleMyKml() {

if (toggleState == 1) {

map.removeOverlay(geoXml);

toggleState = 0;

} else {

map.addOverlay(geoXml);

toggleState = 1;

}

</script>

</head>

</div>

<br/>

</body>

</html>

Justin_Deoliveira · August 14, 2008, 12:57am

Hi Clark,

The reason why this is not working is because the url you pass to the GGeoXml object has to be "internet visible". If you look at the example on the GeoServer demo page (it uses georss but the same applies):

http://localhost:8080/geoserver/rss/gmaps.html

You will notice it is accessing the feed from one of our servers at openplans, and not the local host.

-Justin

Clark Woodward wrote:

I am trying to directly integrate Geoserver with a web page containing a Google Maps control. However serving a KML from Geoserver into a Google Maps control seems to fail. Is there a way to overcome this? Sample code below.

Should Geoserver be able to server KMLs into a Google Maps control?

Thanks in advance.

Clark

CODE SAMPLE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"

      xmlns:v="urn:schemas-microsoft-com:vml">

  <head>

    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>

    <title>Google Maps API Example: GGeoXml KML Overlay</title>

    <script src="http://maps.google.com/maps?file=api&v=2&key=ABQAAAy0fUqYNFQ7C7xz9H-dbIbhSon-XbW9m4z5cwANTjRUXLA7vUPRSOY2gMtU3bW1bIeFuDmoexenB8QA"

      type="text/javascript"></script>

    <script type="text/javascript">

    var map;

    var geoXml;

    var toggleState = 1;

    function initialize() {

      if (GBrowserIsCompatible()) {

        *geoXml = new GGeoXml("http://localhost:8080/geoserver/wms/kml_reflect?layers=tiger:tiger_roads"\);*

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

        map.addControl(new GLargeMapControl());

        map.addControl(new GLargeMapControl());

        map.addOverlay(geoXml);

      }

    }

    function toggleMyKml() {

      if (toggleState == 1) {

        map.removeOverlay(geoXml);

        toggleState = 0;

      } else {

        map.addOverlay(geoXml);

        toggleState = 1;

      }

    }

            </script>

  </head>

  <body onload="initialize()">

    <div id="map_canvas" style="width: 640px; height: 480px; float:left; border: 1px solid black;"></div>

    </div>

    <br clear="all"/>

    <br/>

    <input type="button" value="Toggle KML" onClick="toggleMyKml();"/>

  </body>

</html>

------------------------------------------------------------------------

-------------------------------------------------------------------------
This SF.Net email is sponsored by the Moblin Your Move Developer's challenge
Build the coolest Linux based applications with Moblin SDK & win great prizes
Grand prize is a trip for two to an Open Source event anywhere in the world
http://moblin-contest.org/redirect.php?banner_id=100&url=/

------------------------------------------------------------------------

_______________________________________________
Geoserver-users mailing list
Geoserver-users@lists.sourceforge.net
https://lists.sourceforge.net/lists/listinfo/geoserver-users

--
Justin Deoliveira
Software Engineer, OpenGeo
http://opengeo.org