3

I am trying to load a kml file using the ESRI javascript API v. 3.5. What I did with v. 2.6 no longer works. How do you add KML data with the latest esri javascript api? I am testing on my local machine, which used to work fine.

<html>
    <head>
        <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/dojo/dijit/themes/claro/claro.css">
        <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/esri/css/esri.css"> 

        <style>
      html, body, #map {
        height:100%;
        width:100%;
        margin:0;
        padding:0;
      }
      body {
        background-color:#FFF;
        overflow:hidden;
        font-family:"Trebuchet MS";
      }
    </style>

        <script src="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/"></script>
        <script>
            dojo.require("esri.map");
            dojo.require("esri.layers.KMLLayer");

            function init() {
              var beginExt = new esri.geometry.Extent(-81.26, 40.64, -74.10, 42.29, new esri.SpatialReference({wkid:4326}));
              var revExt = esri.geometry.geographicToWebMercator(beginExt);
              var map = new esri.Map("map",{
                basemap:"topo",
                extent:revExt,
                sliderStyle:"small"
              });

              var kmlurl = "https://dl.dropboxusercontent.com/u/56614088/PA_Hospitals_2010.kmz";
              var kml = new esri.layers.KMLLayer(kmlurl);
              map.addLayer(kml);

            }

            dojo.ready(init);
    </script>
    </head>
    <body>
        <div id="map"></div>
        <div id="info"></div>
    </body>
</html>

In the console I get an error

Origin null is not allowed by Access-Control-Allow-Origin.

This seemed to work fine with the older api why the difference? How can we test locally since kml files have to be a public url without running a server?

EDIT

I ended up installing IIS on Windows 8. I then used localhost. In Chrome it would not work still gave me an error of

Origin ...localhost is not allowed by Access-Control-Allow-Origin

So I tried IE again and it worked with localhost once I enabled intranet settings. However, I did discover if you use the computer name ie.. http:// computername instead of localhost it will work in chrome as well.

3

Sounds like you need to set up a local web server so that you load your page over http://, not file://. More info: http://developers.arcgis.com/en/javascript/jshelp/intro_devenv.html

3

To view the kml from the link in dropbox, you'll have to set up a proxy page (link). When v. 3.4 came out, I noticed the api became more stringent about the cross origin issues. If your browser supports CORS, but dropbox won't allow sharing with all sites (including localhost), then the content is blocked without a proxy.

Also, check what browser you're testing with. There have been issues where Google Chrome won't support localhost on CORS requests. Double-check with Internet Explorer 9 or 10, which does support it.

But in general, the best way to get around it is by using the proxy page (plus using the addProxy function found in 3.5 to make your browser use the proxy to get the kml).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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