topic Re: Display KML File in 4.X API in ArcGIS JavaScript Maps SDK Questions

Display KML File in 4.X API

CalebSchwind — Mon, 06 Jan 2020 14:25:46 GMT

Is there a way to display data from a KML file in a KMLLayer. I found some code at the bottom of this post Is it possible to load KML from a file?, that works for displaying KML files in the 3.x api. Is there something similar that can be done in the 4.x api?

Re: Display KML File in 4.X API

Egge-Jan_Pollé — Mon, 06 Jan 2020 14:32:08 GMT

Hi Caleb Schwind,

Yes, KMLLayer is supported in the 4.x api since version 4.5:

KMLLayer | ArcGIS API for JavaScript 4.14

You might have a look at this sample: KMLLayer | ArcGIS API for JavaScript 4.14

HTH,

Egge-Jan

Re: Display KML File in 4.X API

CalebSchwind — Mon, 06 Jan 2020 14:47:07 GMT

Hi Egge-Jan Pollé,

The sample shows how to load a KMLLayer using a url. Is there a way to display a KMLLayer from local files on the user's machine in 4.x? In my app, I've added the ability for a user to select local files and have them displayed on the map.

Re: Display KML File in 4.X API

MikeHorn — Tue, 07 Jan 2020 01:02:13 GMT

Can you use URL.createObjectURL to create a URL to pass to KMLLayer?

Re: Display KML File in 4.X API

CalebSchwind — Tue, 07 Jan 2020 14:25:19 GMT

I just tried using URL.createObjectURL, but the https://utility.arcgis.com/sharing/kml?url=<generatedUrl> web service ,that is called when the KMLLayer is initialized, immediately returns an "Invalid URL" error.

The url that is generated looks like "blob:http://mysite.com/56f7c728-05d6-4fb1-8a4e-0e76714ca57c". If I remove the "blob:" part of the url, then the https://utility.arcgis.com/sharing/kml service will spin for a while and eventually return a "File not found. Wrong url or out of memory" error.

It looks like the web service that supports the KMLLayer rejects any url with something before "http".

Re: Display KML File in 4.X API

CalebSchwind — Tue, 07 Jan 2020 14:41:33 GMT

I can directly call the https://utility.arcgis.com/sharing/kml web service with the contents of the file that I loaded in, but I don't see any way to make a KMLLayer from the response. When I do this I get the following response:

The last post in Is it possible to load KML from a file? shows how to create the KMLLayer from the above response in the 3.X api, but the KMLLayer in 4.X doesn't have the parameters necessary to use this method.

Re: Display KML File in 4.X API

CharlieElverson — Tue, 07 Jan 2020 22:31:10 GMT

Hi Caleb, I ran into some similar headaches a while back. I wanted to just create a layer from a KML file on the local machine, but the sharing/kml service refused to accept just the kml file contents.

Do you have a back-end that you can add to?

If so, create 2 REST endpoints. One POST endpoint for uploading the KML file and one GET endpoint for retrieving it.

On the front-end, the user "opens" the file, which uploads it to the POST endpoint. Then, after a successful upload, use the GET endpoint to provide the url for the kml layer.

It's a little clunky, but it's what I had to do, since the KML service refused to work with anything other than a web-accessible file.

Re: Display KML File in 4.X API

CalebSchwind — Wed, 08 Jan 2020 12:55:40 GMT

Unfortunately, I don't have a back-end that I can add to.

Re: Display KML File in 4.X API

SteveCole — Wed, 08 Jan 2020 16:24:36 GMT

You can do this, but you have to cobble a solution together. I don't have my own link handy at the moment but I'll post the link to a working example tonight.

Anyways, the strategy is to use the File & FileReader API of HTML 5 to allow your user to specify their desired KML file and to read its contents in. The next step is to convert the KML into JSON/geoJSON and then make your JS API map layer from that. There are JS libraries that facilitate this conversion.

Now, I will say that the working example I'll share later was written with simple KMLs in mind (a single polygon or several). I don't know how well it might work if the KML files you intend to support are more complex.

Anyways, more later..

Re: Display KML File in 4.X API

SteveCole — Thu, 09 Jan 2020 07:24:54 GMT

Ok, I couldn't find/remember my link because I still had it just on my machine's Localhost.

Anyways, I've uploaded it and you can access it here: https://umpqualsogproject.org/ra32screener/

It's an app I've been developing but it's not finished. It's a long story but the part where you upload your KML should work fine.

Hope this helps,

Steve

Re: Display KML File in 4.X API

CalebSchwind — Thu, 09 Jan 2020 15:47:49 GMT

I was able to get the KML file import working, using this method. Some of my KMLs are more complex, but I think I can use the results from https://utility.arcgis.com/sharing/kml to get what I need that is missing from the kml to geoJSON conversion.

Thank you!