Class: CanvasHexagonalGrid

.canvas~CanvasHexagonalGrid(options)

A hexagonal grid that uses HTML5's canvas. Extends `BaseHexagonalGrid`.

Constructor

new CanvasHexagonalGrid(options)

Construct a Canvas-based hexagonal grid. See `BaseHexagonalGrid.constructor` for more valid options.
Parameters:
Name Type Description
options Object Optional values
Properties
Name Type Attributes Default Description
canvasPadding Object <optional>
 {x: 0, y:0} padding around the inside edge of the canvas, essentially shrinking the render area of the canvas
autoResize boolean <optional>
 true Allow the grid to adjust with `resize` events automatically, using `CanvasHexagonalGrid.resize()`.
Properties:
Name Type Description
canvas HTMLCanvasElement The canvas we are drawing to
ctx CanvasRenderingContext2D The ContextRenderingContext2D instance of `CanvasHexagonalGrid.canvas`
Source:

Members

default_options

Defines what the default values are for the options of this class when instantiated, see `HexagonalGrid.Constructor` for more details.
Source:

nodeRadius

Dynamic getter that defines the radius of each node, based on the size of `CanvasHexagonalGrid.canvas`
Source:

Methods

preRender()

Overridable function that is called at the start of `CanvasHexagonalGrid.render()`. By default, it clears the entire canvas using `this.ctx.clearRect`.
Source:

renderNode(node, data)

Overridable function that is called during `CanvasHexagonalGrid.render()`, once for each node in `CanvasHexagonalGrid.nodes`. By default it strokes a black hexagon around the node, of size `CanvasHexagonalGrid.nodeRadius` using `strokeHexagon`.
Parameters:
Name Type Description
node HexNode A hexagonal node
data Object The data stored relating to `node`.
Source:

resize()

Sets the canvas width and height to the actual size in the document, and recalls `CanvasHexagonalGrid.render()` to ensure that everything looks good.
Source: