StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>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.</p> <p>Here I briefly show you how the codes are written. </p> <pre><code><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> </code></pre> <p>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 <a href="https://gis.stackexchange.com/questions/12647/how-to-dynamically-update-a-kml-layer-in-openlayers-2-10">link</a></p> <p>Last but not least, I hope my answer isn't too late for you. </p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload