3

I need to overlay KML polygons on basic map in OpenLayers. I need that KML is visible on every zoom level. I did some coding, but my KML is not showing up. What am I doing wrong?

<!DOCTYPE html>
<html>
  <head>
    <title>OpenLayers Tutorial - Basic Map Setup</title>
    <script src="http://openlayers.org/api/OpenLayers.js"></script>
    <script type="text/javascript">
        var map, baseLayer;
        function init(){
            map = new OpenLayers.Map('map');     

            baseLayer = new OpenLayers.Layer.WMS("OpenLayers WMS", "http://labs.metacarta.com/wms/vmap0", {layers:"basic"});
            map.addLayer(baseLayer);

            kml1 = new OpenLayers.Layer.Vector("KML", {
            strategies: [new OpenLayers.Strategy.Fixed()],
            protocol: new OpenLayers.Protocol.HTTP({
                url: "kmls/MobileCoverage.kml",
                format: new OpenLayers.Format.KML({
                    extractStyles: true, 
                    extractAttributes: true,
                    maxDepth: 2
                })
            })
        });
        map.addLayer(kml1);

       map.zoomToMaxExtent();            
        }
    </script>

    <style>
    @media screen
    {
        #map{width: 800px; height:500px; border: 2px solid black;}
    }
    </style>
  </head>
  <body onload="init()">
    <h3>OpenLayers Testing</h3>
    <div id="map"></div>
  </body>
</html>
Improve this question
2
  • My mistake, I got mixed up comparing the open and close parens.
    – Get Spatial
    Aug 21, 2012 at 17:52
  • 1
    Just a thought after looking at the .jpg of the data you posted. Have you made sure that your data is clean. There look to be some pretty complex polygons there, and I see a couple places where there could be crossovers within the polygon geometry. I'm not sure how well that sort of thing is handled by OpenLayers, but it might be something to check.
    – Get Spatial
    Aug 21, 2012 at 18:10

5 Answers 5

Reset to default
3

The Example here http://harrywood.co.uk/maps/examples/openlayers/kml.html

    map = new OpenLayers.Map("mapdiv");
map.addLayer(new OpenLayers.Layer.OSM());

var kmllayer = new OpenLayers.Layer.Vector("KML", {
        strategies: [new OpenLayers.Strategy.Fixed()],
        protocol: new OpenLayers.Protocol.HTTP({
            url: "./mapperz-kml-example.kml",
            format: new OpenLayers.Format.KML({
                extractStyles: true, 
                extractAttributes: true,
                maxDepth: 2
            })
        })
    });

has points lines and polygons as KML you can view the code to inspect what you are trying to do. The KML should be on a public webserver or generated from a database.

Improve this answer
9
  • Thanks. So KML can't be in the same folder with index.html and OpenLayers.js, it needs to be on a webserver or in a database?
    – againstflow
    Aug 20, 2012 at 13:38
  • locally (localhost it can be) but kml in this case seems to work better from another source/location (openlayers bug?)
    – Mapperz ♦
    Aug 20, 2012 at 13:40
  • Is it ok to upload it to Dropbox and get a link to KML? I tried that, but KML it's not showing neither.
    – againstflow
    Aug 20, 2012 at 14:28
  • 1
    Does your KML have anything other than plain polygons? no network/overlays included as they are not supported.
    – Mapperz ♦
    Aug 20, 2012 at 15:37
  • It looks like this. What do you think? i50.tinypic.com/1gcc7.jpg
    – againstflow
    Aug 20, 2012 at 17:13
2

I tried your code and KML and it worked fine for me. Are you seeing the push pin? If you're not seeing anything at all, I would verify the location/spelling of your KML file.

At map.zoomToMaxExtent(); you can't see it because the push pin is blocking it:

enter image description here

But zoom in and you should see it:

enter image description here

Improve this answer
12
  • Interesting, thanks. Tell me, where did you put my KML file? I'm using it from the folder "kmls" where is my index.html. I don't see any pin or polygon.
    – againstflow
    Aug 21, 2012 at 19:09
  • That's the same thing I did, placed it in "kmls" folder in root. You know... there was one more thing I did (not sure if this did anything) but I opened your KML in <oXygen/> XML Editor and it complained about a very long line and did linewrap or something (not sure) but I will paste the KML in my response incase you want to try that KML.
    – CaptDragon
    Aug 21, 2012 at 19:13
  • Okay, I'm having trouble finding somewhere to place the very large KML file (1.3GB). However when I placed my example on a public web hosting, IT DOES NOT WORK. It only works when I point to the local file in firefox to this address file:///D:/temp/jsdev/kml_test.html So i don't think it's the KML anymore. Maybe it's something else which I don't know, but try locally how it works for me.
    – CaptDragon
    Aug 21, 2012 at 19:30
  • It is 1.25 MB, not GB :) You don't have dropbox or google drive?
    – againstflow
    Aug 21, 2012 at 19:36
  • ohh right MB... here's the link but I'm pretty sure it isn't the KML now. Even though kmlvalidator complains about it... validators are nitpickers.
    – CaptDragon
    Aug 21, 2012 at 19:40
2

I think validating is essential to get past the 'is it the kml point' I recently had some attribute issue where a CDATA block had to be used to make it validate. I use the same KML on either openlayers maps and in google earth. I noticed that google earth is rather picky, less forgiving than using openlayers kml support.

Hence I make sure that the kml (dynamically generated) is compliant by testing it in google earth, if it opens there, it should be ok. I also use google's validator to make sure I don't waste time on any format issues. It wouldn't surprise me to see that Chrome xml parsing pickyness is the cause. I use FireBug to verify what the browser did, it's available under chrome, although less functional than in firefox.

Improve this answer
-1

i'm very interested in the example above. i try to replicate in my local pc (simulated server) but it doesnt work well. I is possible to send or post all the files involve in the example. Best regrads RD

Improve this answer
-2

The clearest first problem is that your Javascript is wrong: the function init() will run when the page is loaded, while the line map.addLayer(kml1) will run as soon as the script is parsed. So move the map.addLayer(kml1) line into the init function to get back on the right track.

Improve this answer
1
  • Hm, but it is inside init() function. Can you explain more detailed? Thanks.
    – againstflow
    Aug 20, 2012 at 13:17

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.