Grid Clusterer v1.8.0

Overview

The grid clusterer uses the Google maps API to manage a large number of "data points", and displays the data points in grid-like "clusters".

Use the following links to learn about the grid clusterer:

Data Points

The grid clusterer accepts "data point" objects as input. A data point object has the following properties:

{
   key: number | string,   // The data point key (any unique number or string)
   lat: number,            // The data point latitude
   lon: number             // The data point longitude
}
            

An example of a data point with a numeric key is shown below:

data_pt = { key: 7133, lat: 37.4220698, lon: -122.086278 };
            

An example of a data point with a string key is shown below:

data_pt = { key: "GoogleHQ", lat: 37.4220698, lon: -122.086278 };
            

Using data points results in decreased memory usage as well as a performance increase as there is no need to create Google map markers. See Creating data points vs creating Google map markers

Grid Tiles and Cluster Markers

By default, Google maps consist of tiles that are 256 x 256 pixels in size. "Grid tiles" that are visible within the map bounds are "indexed" starting at index 0, which is always located in the top left corner of the map viewport. Index numbers increase as you move left to right in column, then row order (as shown below).

Data points are "clustered" into individual tiles. When the number of data points in a tile exceed a configured minimum, a single "cluster marker" is displayed in the center of the tile. In the following image, two cluster markers are present:

Grid tiles image

Grid Points and Grid Point Markers

Tiles contain a configurable number of "grid point" rows and columns. When the number of data points in a tile is less than the minimum to show a cluster marker, the data points are organized into grid points. The number of grid points within a tile depends on the tile size and the number of grid point rows and columns set when the clusterer is configured. A "grid point marker" is displayed in the center of each grid point that contains one or more data points.

In the example below, the tile size is 256 x 256 pixels and the clusterer was configured to use 2 grid point rows and columns, so each tile will contain 4 grid points.

Grid points within a tile are indexed starting at index 0, which is always the grid point in the top left corner of a tile, moving left to right in column, then row order.

Grid point image

The same tile, using a clusterer configured to use 4 grid point rows and columns has 16 grid points numbered 0 to 15, as shown below:

Grid point image

* Note that grid point borders are not displayed by the clusterer, but were included in the images above for illustration purposes.

See the example of tiles and grid points.