Class: HexbinLayer<Data>

A layer for displaying binned data in a hexagon grid on a Leaflet map. Extends L.SVG to take advantage of built-in zoom animations.

Extends

SVG

Type Parameters

• Data = L.LatLngExpression

Constructors

new HexbinLayer()

new HexbinLayer<Data>(options?): HexbinLayer<Data>

Defined in: HexbinLayer.ts:219

Parameters

options?

HexbinLayerConfig

Returns

HexbinLayer<Data>

Overrides

L.SVG.constructor

Properties

options

options: Required<HexbinLayerConfig> & RendererOptions

Defined in: HexbinLayer.ts:151

Default options for the hexbin layer

Overrides

L.SVG.options

_scale

_scale: object

Defined in: HexbinLayer.ts:187

D3 scales used for the hexbin layer

color

color: ScaleLinear<string, string>

radius

radius: ScaleLinear<number, number>

opacity

opacity: ScaleLinear<number, number>

_hexLayout

_hexLayout: Hexbin<HexbinData<Data>>

Defined in: HexbinLayer.ts:200

_container

_container: SVGSVGElement

Defined in: HexbinLayer.ts:15

Inherited from

L.SVG._container

_fn

protected _fn: object

Defined in: HexbinLayer.ts:175

Internal functions to access the data

colorValue()

colorValue: (d) => number

Parameters

d

HexbinData<Data>[]

Returns

number

radiusValue()

radiusValue: (d) => number

Parameters

d

HexbinData<Data>[]

Returns

number

opacityValue()

opacityValue: (d) => number

Parameters

d

HexbinData<Data>[]

Returns

number

fill()

fill: (d) => string

Parameters

d

HexbinData<Data>[]

Returns

string

_dispatch

protected _dispatch: Dispatch<SVGPathElement>

Defined in: HexbinLayer.ts:194

_hoverHandler

protected _hoverHandler: HexbinHoverHandler<Data>

Defined in: HexbinLayer.ts:197

_data

protected _data: Data[]

Defined in: HexbinLayer.ts:206

_map

protected _map: Map

Defined in: HexbinLayer.ts:209

Overrides

L.SVG._map

_tooltipOptions

protected _tooltipOptions: TooltipOptions<Data> = {}

Defined in: HexbinLayer.ts:211

protected _tooltip: undefined | Tooltip

Defined in: HexbinLayer.ts:212

_d3Container

protected _d3Container: Selection<SVGGElement, unknown, null, undefined>

Defined in: HexbinLayer.ts:217

Methods

onAdd()

onAdd(map): this

Defined in: HexbinLayer.ts:256

Callback made by Leaflet when the layer is added to the map

Parameters

map

Map

Reference to the map to which this layer has been added

Returns

this

Overrides

L.SVG.onAdd

onRemove()

onRemove(map): this

Defined in: HexbinLayer.ts:274

Callback made by Leaflet when the layer is removed from the map

Parameters

map

Map

Reference to the map from which this layer is being removed

Returns

this

Overrides

L.SVG.onRemove

redraw()

redraw(): void

Defined in: HexbinLayer.ts:292

(Re)draws the hexbins data on the container

Returns

void

_createHexagons()

_createHexagons(g, data): void

Defined in: HexbinLayer.ts:329

Parameters

g

Selection<SVGGElement, number, SVGGElement, unknown>

data

HexbinData<Data>[]

Returns

void

_getExtent()

_getExtent(bins, valueFn, scaleExtent): [number, number]

Defined in: HexbinLayer.ts:468

Parameters

bins

HexbinBin<HexbinData<Data>>[]

valueFn

(d) => number

scaleExtent

[number, undefined | number]

Returns

[number, number]

radius()

Call Signature

radius(): number

Defined in: HexbinLayer.ts:495

Get or set the radius of the hexagon grid cells

Returns

number

Call Signature

radius(v): this

Defined in: HexbinLayer.ts:496

Get or set the radius of the hexagon grid cells

Parameters

v

number

Returns

this

opacity()

Call Signature

opacity(): number | [number, number]

Defined in: HexbinLayer.ts:515

Get or set the opacity of the hexbin layer

Returns

number | [number, number]

Call Signature

opacity(v): this

Defined in: HexbinLayer.ts:516

Get or set the opacity of the hexbin layer

Parameters

v

The opacity value to set. If an array is provided, the first element is the minimum opacity and the second is the maximum.

number | [number, number]

Returns

this

duration()

Call Signature

duration(): number

Defined in: HexbinLayer.ts:528

Get or set the duration of transition animations

Returns

number

Call Signature

duration(v): this

Defined in: HexbinLayer.ts:529

Get or set the duration of transition animations

Parameters

v

number

Returns

this

colorScaleExtent()

Call Signature

colorScaleExtent(): [number, undefined | number]

Defined in: HexbinLayer.ts:541

Get or set the color scale domain extent

Returns

[number, undefined | number]

Call Signature

colorScaleExtent(v): this

Defined in: HexbinLayer.ts:542

Get or set the color scale domain extent

Parameters

v

[number, undefined | number]

The color scale extent to set. If an array is provided, the first element is the minimum extent and the second is the maximum. This means that for the purpose of color interpolation, the domain will be clipped to this extent, i.e. values below the minimum will be treated as the minimum, and values above the maximum will be treated as the maximum.

Returns

this

radiusScaleExtent()

Call Signature

radiusScaleExtent(): [number, undefined | number]

Defined in: HexbinLayer.ts:554

Get or set the radius scale domain extent

Returns

[number, undefined | number]

Call Signature

radiusScaleExtent(v): this

Defined in: HexbinLayer.ts:555

Get or set the radius scale domain extent

Parameters

v

[number, undefined | number]

The radius scale extent to set. If an array is provided, the first element is the minimum extent and the second is the maximum. This means that for the purpose of radius interpolation, the domain will be clipped to this extent, i.e. values below the minimum will be treated as the minimum, and values above the maximum will be treated as the maximum.

Returns

this

opacityScaleExtent()

Call Signature

opacityScaleExtent(): [number, undefined | number]

Defined in: HexbinLayer.ts:567

Get or set the opacity scale domain extent

Returns

[number, undefined | number]

Call Signature

opacityScaleExtent(v): this

Defined in: HexbinLayer.ts:568

Get or set the opacity scale domain extent

Parameters

v

[number, undefined | number]

The opacity scale extent to set. If an array is provided, the first element is the minimum extent and the second is the maximum. This means that for the purpose of opacity interpolation, the domain will be clipped to this extent, i.e. values below the minimum will be treated as the minimum, and values above the maximum will be treated as the maximum.

Returns

this

colorRange()

Call Signature

colorRange(): string[]

Defined in: HexbinLayer.ts:581

Get or set the color scale range

Returns

string[]

Call Signature

colorRange(v): this

Defined in: HexbinLayer.ts:582

Get or set the color scale range

Parameters

v

string[]

The color range to set. Colors will be interpolated between all provided colors.

Returns

this

radiusRange()

Call Signature

radiusRange(): null | [number, number]

Defined in: HexbinLayer.ts:595

Get or set the radius scale range

Returns

null | [number, number]

Call Signature

radiusRange(v): this

Defined in: HexbinLayer.ts:596

Get or set the radius scale range

Parameters

v

The min and max radius range to set. If null, the range will be set to the hexagon grid cell radius value.

null | [number, number]

Returns

this

colorScale()

Call Signature

colorScale(): ScaleLinear<string, string>

Defined in: HexbinLayer.ts:608

Get or set the color scale domain

Returns

ScaleLinear<string, string>

Call Signature

colorScale(v): this

Defined in: HexbinLayer.ts:609

Get or set the color scale domain

Parameters

v

ScaleLinear<string, string>

Returns

this

radiusScale()

Call Signature

radiusScale(): ScaleLinear<number, number>

Defined in: HexbinLayer.ts:619

Get or set the radius scale domain

Returns

ScaleLinear<number, number>

Call Signature

radiusScale(v): this

Defined in: HexbinLayer.ts:620

Get or set the radius scale domain

Parameters

v

ScaleLinear<number, number>

Returns

this

colorValue()

Call Signature

colorValue(): (d) => number

Defined in: HexbinLayer.ts:632

Get or set the value mapper for the color scale

Returns

Function

Parameters

d

HexbinData<Data>[]

Returns

number

Default

the length of the data in the hexbin

Call Signature

colorValue(v): this

Defined in: HexbinLayer.ts:633

Get or set the value mapper for the color scale

Parameters

v

(d) => number

The value mapper to set. This function should accept an array of hexbin data and return a number to be used for color interpolation.

Returns

this

Default

the length of the data in the hexbin

radiusValue()

Call Signature

radiusValue(): (d) => number

Defined in: HexbinLayer.ts:646

Get or set the value mapper for the radius scale

Returns

Function

Parameters

d

HexbinData<Data>[]

Returns

number

Default

the length of the data in the hexbin

Call Signature

radiusValue(v): this

Defined in: HexbinLayer.ts:647

Get or set the value mapper for the radius scale

Parameters

v

(d) => number

The value mapper to set. This function should return a number for each bin, which will be used to determine the radius of the hexagon.

Returns

this

Default

the length of the data in the hexbin

fill()

Call Signature

fill(): (d) => string

Defined in: HexbinLayer.ts:660

Get or set the value mapper for the fill color of the hexbins

Returns

Function

Parameters

d

HexbinData<Data>[]

Returns

string

Default

a color interpolated from the color scale based on the value returned by the colorValue function

Call Signature

fill(v): this

Defined in: HexbinLayer.ts:661

Get or set the value mapper for the fill color of the hexbins

Parameters

v

(d) => string

The value mapper to set. This function should return a string to be used as the fill color for the hexbin.

Returns

this

Default

a color interpolated from the color scale based on the value returned by the colorValue function

data()

Call Signature

data(): Data[]

Defined in: HexbinLayer.ts:675

Get or set the data to be binned by the hexbin layer. Triggers a redraw of the hexbins when set.

Returns

Data[]

Call Signature

data(v): this

Defined in: HexbinLayer.ts:676

Get or set the data to be binned by the hexbin layer. Triggers a redraw of the hexbins when set.

Parameters

v

Data extends LatLngExpression ? Data<Data>[] : never

The data to set. This should be an array of data to be binned.

Returns

this

Call Signature

data(v, accessor?): this

Defined in: HexbinLayer.ts:677

Get or set the data to be binned by the hexbin layer. Triggers a redraw of the hexbins when set.

Parameters

v

Data[]

The data to set. This should be an array of data to be binned.

accessor?

(d) => LatLngExpression

An optional function to convert the data into a LatLngExpression. If not provided, the data is assumed to be an array of LatLngExpressions.

Returns

this

accessor()

accessor(): (d) => LatLngExpression

Defined in: HexbinLayer.ts:696

Returns

Function

Parameters

d

Data

Returns

LatLngExpression

dispatch()

dispatch(): Dispatch<SVGPathElement>

Defined in: HexbinLayer.ts:703

Returns

Dispatch<SVGPathElement>

hoverHandler()

Call Signature

hoverHandler(): HexbinHoverHandler<Data>

Defined in: HexbinLayer.ts:708

Get or set the hover handler for the hexbin layer.

Returns

HexbinHoverHandler<Data>

Call Signature

hoverHandler(v): this

Defined in: HexbinLayer.ts:709

Get or set the hover handler for the hexbin layer.

Parameters

v

HexbinHoverHandler<Data>

Returns

this

tooltip(tooltip): this

Defined in: HexbinLayer.ts:723

Get or set the tooltip content and options for the hexbin layer.

Parameters

TooltipOptions<Data>

Returns

this

getTooltip()

getTooltip(): undefined | Tooltip

Defined in: HexbinLayer.ts:736

Get the tooltip instance attached to the hexbin layer

Returns

undefined | Tooltip

Overrides

L.SVG.getTooltip

bindTooltip()

bindTooltip(content, options?): this

Defined in: HexbinLayer.ts:744

Bind a tooltip to the hexbin layer with the provided content and options. Useful to bind an existing tooltip instance to the hexbin layer.

Parameters

content

Content | Tooltip

options?

TooltipOptions

Returns

this

Overrides

L.SVG.bindTooltip

unbindTooltip()

unbindTooltip(): this

Defined in: HexbinLayer.ts:761

Unbind the tooltip from the hexbin layer

Returns

this

Overrides

L.SVG.unbindTooltip

getLatLngs()

getLatLngs(): LatLng[]

Defined in: HexbinLayer.ts:770

Returns

LatLng[]

toGeoJSON()

toGeoJSON(): Feature<MultiPoint, LatLng>

Defined in: HexbinLayer.ts:779

Returns

Feature<MultiPoint, LatLng>

_accessor()

protected _accessor(d): LatLngExpression

Defined in: HexbinLayer.ts:240

Parameters

d

Data

Returns

LatLngExpression

_destroyContainer()

protected _destroyContainer(): void

Defined in: HexbinLayer.ts:285

Clean up the svg container

Returns

void

_linearlySpace()

protected _linearlySpace(from, to, length): number[]

Defined in: HexbinLayer.ts:324

Parameters

from

number

to

number

length

number

Returns

number[]

HexbinHoverHandler

Functions

Class: HexbinLayer<Data> ​

Extends ​

Type Parameters ​

Constructors ​

new HexbinLayer() ​

Parameters ​

options? ​

Returns ​

Overrides ​

Properties ​

options ​

Overrides ​

_scale ​

color ​

radius ​

opacity ​

_hexLayout ​

_container ​

Inherited from ​

_fn ​

colorValue() ​

Parameters ​

d ​

Returns ​

radiusValue() ​

Parameters ​

d ​

Returns ​

opacityValue() ​

Parameters ​

d ​

Returns ​

fill() ​

Parameters ​

d ​

Returns ​

_dispatch ​

_hoverHandler ​

_data ​

_map ​

Overrides ​

_tooltipOptions ​

_tooltip ​

_d3Container ​

Methods ​

onAdd() ​

Parameters ​

map ​

Returns ​

Overrides ​

onRemove() ​

Parameters ​

map ​

Returns ​

Overrides ​

redraw() ​

Returns ​

_createHexagons() ​

Parameters ​

g ​

data ​

Returns ​

_getExtent() ​

Parameters ​

bins ​

valueFn ​

scaleExtent ​

Returns ​

radius() ​

Call Signature ​

Returns ​

Call Signature ​

Parameters ​

v ​

Returns ​

opacity() ​

Call Signature ​

Returns ​

Class: HexbinLayer<Data>

Extends

Type Parameters

Constructors

new HexbinLayer()

Parameters

options?

Returns

Overrides

Properties

options

Overrides

_scale

color

radius

opacity

_hexLayout

_container

Inherited from

_fn

colorValue()

Parameters

d

Returns

radiusValue()

Parameters

d

Returns

opacityValue()

Parameters

d

Returns

fill()

Parameters

d

Returns

_dispatch

_hoverHandler

_data

_map

Overrides

_tooltipOptions

_tooltip

_d3Container

Methods

onAdd()

Parameters

map

Returns

Overrides

onRemove()

Parameters

map

Returns

Overrides

redraw()

Returns

_createHexagons()

Parameters

g

data

Returns

_getExtent()

Parameters

bins

valueFn

scaleExtent

Returns

radius()

Call Signature

Returns

Call Signature

Parameters

v

Returns

opacity()

Call Signature

Returns

Call Signature

Parameters