Dynamic kml google maps

Question

I want to create a google maps app with kml, and i want to create the kml file dynamically depending on the zoom of the user.

Something like google earth but in google maps (the zooming part)

I tried to use the markermanager and clusterer but i have too many markers and performance on mobile devices is very bad but with kml that is not an issue but i have all marker displayed at once.

I tried to use NetworkLink in the kml file but i dont get any parameters like zoom or bounds (i am using php)

I know it could be done with JavaScript

new google.maps.KmlLayer('mykmlgenerator.php?zoom='+zoom);

but i would like to avoid that is there any way?

thank you

Answer 1

I tried this, only to realize that dynamic KML with Google Maps is clunky. If you can, it's easier to just convert your KML into JSON and create your markup on the map using the Google Maps JavaScript API ( https://developers.google.com/maps/documentation/javascript/ ).

Answer 2

Firstly, let me be clear that OpenLayers are better than Google Maps if you want to use dynamic KML. Next, I want to give some simple JavaScript that we will use in OpenLayers. You should try them since it also using JavaScript library.

Here I briefly show you how the codes are written.

<html>
<head>
<title>Google Layer with KML file</title>
<link rel="stylesheet" href="http://openlayers.org/api/theme/default/style.css" type="text/css" />
<link rel="stylesheet" href="http://openlayers.org/dev/examples/style.css" type="text/css" />
<script src='http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAl9RMqSzhPUXAfeBCXOussRTQDbvAygy0cfGJr8dEMAYKf3RWNBQqP9mjKIsqTfmAlz5LOJ3Xpy5s4w'></script>
<script src="http://openlayers.org/api/OpenLayers.js"></script>
<script type="text/javascript">

var map;

function init() {
    // Create the map object
    map = new OpenLayers.Map('map');
    // Create a Google layer
    var gmap = new OpenLayers.Layer.Google(
        "Google Streets", // the default
        {numZoomLevels: 20}
    );
    // Add layer to map
    map.addLayer(gmap);

    //Adding KML file to map
    map.addLayer(new OpenLayers.Layer.GML("KML", "yourkml.kml", 
           {
            format: OpenLayers.Format.KML, 
            formatOptions: {
              extractStyles: true, 
              extractAttributes: true,
              maxDepth: 2
            }
           }));
    // Zoom to Kuala Lumpur, Malaysia
    map.setCenter(new OpenLayers.LonLat(101.686855,3.139003), 13);         
}
</script>
</head>
<body onload="init()">
<h1 id="title">Google Layer with KML file</h1>
<div id="map" style='width: 700px; height: 700px'></div>
</body>
</html>

As you can see, there is a small orange dot on the map. That is the KML file loaded on Google Maps. And If you want to refresh them, check this link

Last but not least, I hope my answer isn't too late for you.

Dynamic kml google maps

Question

2 answers

solution1
2 2013-11-21 15:24:16

solution2
1 ACCPTED 2011-08-24 03:07:13

Dynamic kml google maps

Question

2 answers

solution1 2 2013-11-21 15:24:16

solution2 1 ACCPTED 2011-08-24 03:07:13

solution1
2 2013-11-21 15:24:16

solution2
1 ACCPTED 2011-08-24 03:07:13