> ## Documentation Index > Fetch the complete documentation index at: https://docs.kinetica.com/llms.txt > Use this file to discover all available pages before exploring further. # Point Clustering ## Example An example of point clustering is available below: * [Point Cluster](https://github.com/kineticadb/kinetica-kickbox-mapbox-gl/blob/master/examples/point-cluster.html) You will need a current Mapbox API key and some minor modifications will be required in order to run each example. At a minimum, you will need a *Kinetica* table with latitude/longitude values. ## Visualizing Point Clusters This example demonstrates the power of *Kinetica* to aggregate millions of records into granular clusters (thousands as a result) and send them to the browser. It then leverages the power of *Mapbox* and *Supercluster* to further aggregate these clusters based on zoom scale and visualize them on the map. The result is a high-performance and impressive display of clustering on a massive scale, which allows for the visualization of millions of points in a digestible way. Furthermore, each cluster can be clicked-on to reveal statistics about the cluster itself, including how many individual points are contained and the smallest & largest clusters in the current grouping. ## Initializing the Map First, ensure *Kinetica* Kickbox.js and its stylesheet are included in the HTML page. If you're using npm to install *Kickbox*, add this *JavaScript* include between the final DOM element and the closing `` tag: ```html theme={null} ``` The style sheet should be included in the `` of the HTML: ```html theme={null} ``` The map will have to be initialized before a *Kinetica* WMS layer can be added to it. Map initialization via [API Documentation](/content/connectors/kickbox_api#initmap) is promisified, so that initialization is guaranteed to complete before any layers are added, avoiding startup errors. Since this initialization function sets up basic authentication for *Kinetica* and connects to the *Mapbox* API all at once, it is intended to replace the existing map initialization function provided by *Mapbox*. ```html theme={null} kickbox.initMap({ mapboxgl: , kineticaUrl: 'http://:9191', wmsUrl: 'http://:9191/wms', mapboxKey: '', mapDiv: '', username: '', password: '' }).then(function(map){...} ``` The code above initializes the *Mapbox* map, sets the parameters for basic authentication inside of *Mapbox*, and also sets the basic authentication parameters for any `XmlHttpRequests` made to *Kinetica* itself. The function returns the standard *Mapbox* map. For an example call, see [API Documentation](/content/connectors/kickbox_api#initmap). ## Adding a Point Cluster Layer After initialization, a point cluster layer can be added to the map. Performing this manually would require creating & adding a source, layer, & *supercluster* object; requesting & processing the aggregations from *Kinetica*; then piecing together the WMS URL with all of the configuration & rendering parameters, and finally, binding every `zoomend` and `moveend` event to reconstruct the WMS URL during interaction with the map. Fortunately, this process can be simplified with the [API Documentation](/content/connectors/kickbox_api#addclusterlayer) function: ```html theme={null} kickbox.addClusterLayer( map, { layerId: '', mapboxgl: window.mapboxgl, kineticaUrl: 'http://:9191', tableName: '', xAttr: '', yAttr: '', geohashAttr: '', precision: , clusterRadius: , useBbox: false, renderingOptions: { // Customize output here } } ); ``` That is all the code required to visualize data in *Kinetica* on a *Mapbox* map, using point clustering! By customizing the `renderingOptions` parameters, the way the points are rendered can be altered, including size, color, and shape. See the [WMS endpoint documentation](/content/api/rest/wms_rest) for the full set of rendering options to customize output. A WKT column is not currently allowed when creating clusters--x/y columns must be used. For an example call, see [API Documentation](/content/connectors/kickbox_api#addclusterlayer). ## Full Code Example The `kbConfig` object should be updated with the settings for the target *Kinetica* environment for this example to run. Note that the *Kickbox* files, kickbox.min.js & kickbox.css are assumed to be local to this HTML file. ```html theme={null} Kinetica Kickbox: Point Cluster Example
``` ## A Note About Data Design In order to visualize point clusters on a map, a geohashed column of coordinates in the table is required. A detailed discussion of geohashing is outside the scope of this documentation, but briefly, it is the encoding of coordinate data into strings of a predetermined precision. These strings can then be run through a `GROUP BY` query using a substring with a passed precision to generate the atomic clusters used in the example. They are referred to as *atomic clusters*, because the example has no atomic records underlying the visualization (in the browser, that is). That would produce far too many results for the browser to handle. Instead, the *Supercluster* is given the set of aggregated-by-geohash *atomic clusters*, which it then further aggregates as the user zooms in or out. In essence, this provides a way to visualize clusters of clusters in real-time, where the basic level of clustering delivered by *Kinetica* is chosen based on experimentation and performance requirements. *Kinetica* does have functions to encode & decode geohashes, under the *Geometry Functions* section of the [Geospatial Function Reference](/content/concepts/expressions#geospatial-functions). To generate a geohash column, in SQL, from a given source table containing `x` & `y` columns: ```sql theme={null} CREATE OR REPLACE TABLE table_with_coordinates_and_geohashes AS SELECT lon, lat, GEOHASH_ENCODE(lon, lat, ) geohash, ... FROM table_with_coordinates ``` Replace `` with the number of geohash characters to generate for each string representation of the coordinate pairs. This table can also be created natively with the [/create/projection](/content/api/rest/create_projection_rest) endpoint