Show loading status during loading of a GeoJSON using Gmaps

Question

How can I intercept the loading of a GeoJSON using loadGeojson function Gmaps ? I'm carrying a gejson of MultiLineString but takes a few seconds to appear on the screen and I need to add a loading for the user to wait for charging

function load(){
  google.maps.event.addListener(myLayer, 'addfeature', function (e) {
    map.setCenter(e.feature.getGeometry().getAt(0).getAt(0));
  });       

  myLayer.loadGeoJson("/data/myLayer.json");
  myLayer.setMap(map); 

  myLayer.setStyle(function(feature) {  
   return {
      strokeColor: "#B00000",
      strokeOpacity:0.8,  
      strokeWeight: 4  
    };
  });
}

Ivan your answer was the solution to my problem. Thank you! But still have a doubt only works when I create a new map object:

  ......
  var map = new google.maps.Map(document.getElementById('map'), mapOptions);
  cicloviasLayer.setMap(map);

I do not want to create a new map but plot in an existing map, how do I get the loading run in this case?

score 1 · Answer 1 · answered Sep 07 '16 at 11:44

1

If you take a look at the API reference, you'll see that loadGeoJson has a callback function as the third parameter. So you can show a spinner before the call to loadGeoJson and hide it right after the callback is invoked.

answered Sep 07 '16 at 11:44

Anatolii Suhanov

2,524
1
12
14

score 0 · Accepted Answer · edited May 23 '17 at 10:29

0

As described in this SO answer:

Use CSS to add loading giff image:

#map_canvas {background: transparent url(images/ajax-loading.gif) no-repeat center center;}

It will dissappear once map is loaded, as shown in jsfiddle.

edited May 23 '17 at 10:29

Community

1
1

answered Sep 06 '16 at 14:59

Ivan Jovović

5,238
3
29
57

Ivan I need more information sbore the loading on a map object existing, I edited my question – csf Sep 06 '16 at 18:26

Show loading status during loading of a GeoJSON using Gmaps

2 Answers2