Point Shapes

Cosmograph supports per-point shapes so you can encode categories directly in node geometry (circle, square, triangle, and more).

Data-Driven Shapes

Use pointShapeBy to map a data column to point shapes.

const config = {
  points: [
    { id: '1', kind: 'circle' },
    { id: '2', kind: 'square' },
    { id: '3', kind: 'triangle' },
  ],
  pointShapeBy: 'kind',
}

Supported values in the pointShapeBy column:

• Numeric values 0 to 8
• Known string names such as circle, square, triangle, diamond, pentagon, hexagon, star, cross, none
• Any other string (mapped by Cosmograph to drawable shapes through an ordinal scale)

Default Shape

Use pointDefaultShape as fallback when a shape value is missing or invalid.

import { CosmographPointShape } from '@cosmograph/cosmograph'
 
const config = {
  pointShapeBy: 'kind',
  pointDefaultShape: CosmographPointShape.Circle,
}

Shapes with Point Images

When using point images, shapes can stay visible behind them or be hidden for loaded images.

Use hidePointShapesForLoadedImages to control this behavior (defaults to true).

See Point images for the image pipeline.