0

I'm loading large KML layers using the google maps API and geoxml3, via parseKMLString.

Relevant question and Example using this function.

While these files are being rendered to the map, the UI is frozen. As this is using google maps, I can't put this code in a Worker and wrapping this in a promise isn't going to change anything.

Relevant code block:

 var latLong = new google.maps.LatLng(37.0902, -95.7129);
 var myOptions = {
           center: latLong,
           zoom: 10
 };
 myMap = new google.maps.Map(document.getElementById('map-canvas'), myOptions);
 geoXmlParser = new geoXML3.parser({
           map: myMap ,
           singleInfoWindow: true
 });
 geoXmlParser.parseKmlString("long-kml-string", geoXmlParser.docs);

I'm also open to alternatives to both loading these files and other libraries that may exist to assist.

JWiley
  • 3,129
  • 8
  • 41
  • 66
  • 1
    Is this one big polygon/polyline? Can you break the KML into separate (smaller) strings? – geocodezip May 28 '20 at 14:41
  • @geocodezip One large polygon shape. I could break the KML, yes. Is there a way I could doing so extract parts of the polygon xml piecemeal with a setTimeout? – JWiley May 28 '20 at 14:43
  • Or if you have an example somewhere I haven't seen of breaking large KML files into smaller parts for processing I could start there – JWiley May 28 '20 at 14:50
  • 1
    If it is a single (huge) polygon, and you want the UI to not lock up, you need to either make the polygon smaller (so it doesn't take so long to process; you haven't provided enough information to tell whether that will help or not) or modify geoxml3 to do the processing in chunks. There isn't an easy general way to take KML containing a single polygon and break up that file (at least that I know of). You might be able to reduce the resolution of the coordinates and/or simplify the paths (not sure if that will work). Do you have a link to the KML you are using (or reasonably similar)? – geocodezip May 28 '20 at 14:55
  • Another question, can you load the KML with KmlLayer? Or do you need it as a native `google.maps.Polygon`? – geocodezip May 28 '20 at 15:06
  • Unfortunately the KMLs are used for border info, so I can't reduce them. Not sure what you mean by using KMLLayer, I am using parseKMLstring because the file isn't local for parsekml. I've tried to setup an environment with the KML but it's quite slow: https://jsfiddle.net/k0m4njyo/ – JWiley May 28 '20 at 15:17
  • If the KML is at a publicly available URL, you can display it using KmlLayer, that would render faster, but it might not support your use case. – geocodezip May 28 '20 at 16:00
  • The KML string has 13 decimal points of precision. You could probably reduce that to 6 decimal points of precision without being able to see the difference. – geocodezip May 28 '20 at 17:51
  • Also, loading those huge strings on your page will slow down the load, maybe look at retrieving the strings asynchronously. – geocodezip May 28 '20 at 19:37
  • Getting the strings isn't quite the issue, that does add time but the main UI freeze is from the parse. With my scenario I can't edit the files themselves too much in terms of the data, and also can't host them publicly. I'll probably end up having to create something custom that uses your lib, but thank you for the suggestions. – JWiley May 28 '20 at 20:02

0 Answers0