Google Maps Api v.3 Add 27,000 points to the map

Viewed 54

There is a task to place 27000 points of sale on google maps + clustering + infoWindow. At the moment, this is implemented through a normal loop for(point of poits){...} that adds markers to the map. There is a problem with high memory consumption and high load on the browser. I will be grateful for your help.

1 Answers

I would take one of three approaches.

  • Use the WebGLOverlayView - requires knowledge of WebGL and transformation s between coordinate systems
  • Use a custom OverlayView - requires knowledge of DOM and transformations between coordinates and pixels
  • Use deck.gl - adds a bit of overhead to your application but provides a better dev experience for quickly iterating

The WebGL solutions will be higher performance but with added complexity or increase in bundle size.

This sample walks through adding an <img> to the map, but you can do much the same with some css positioning and many HTMLElements representing each point.

Related