Point values

Point inputs accept either [x, y] or {x, y} in JSX and host code. You can mix both forms in one list. Each tuple must contain exactly two coordinates.

<Line from={[0, 0.5]} to={[1, 0.5]} /> <Polygon points={[[0.5, 0], [1, 1], [0, 1]]} /> <Ellipse center={[0.5, 0.5]} radius={[px(30), em(1)]} />

Input	Where it works
`pos`	Placement by Group, Overlay, Graph, Network, and GeoMap
`from`, `to`, `center`, `origin`, `tip`	Line, Circle/Ellipse, Arc, Arrow, Ray, ArrowHead, and their conveniences
`points` and `fill` boundary lists	Polyline/Polygon, Spline, RoundedLine, Points, Arrow, Fill/HFill/VFill
Segment endpoints	`segments={[[[0, 0], [1, 1]], [[0, 1], [1, 0]]]}`
Paired `border-radius`, `radius`, or `point-size`	Rect/Box corners, Ellipse/Arc radii, and Points marker dimensions
Field samples	`vectors={[{point: [0, 0], vector: [1, 2]}]}`
Anchor and alignment pairs	`anchor={[1, 0.5]}`, Box `align`, `fit-align`, and Rotate `origin`
Numeric helper inputs	Vector arithmetic, `spline2d` and path builders, `point_bounds`, `map_point`/`unmap_point`, drawing centers/radii, and placement offsets

The representation does not change coordinate units. Primitive shapes use local fractions, px, and em. Numeric points in graph marks use data coordinates inside Graph or Plot. Tuple coordinates can mix lengths, such as [px(12), 0.5]. Circle's radius remains scalar; Ellipse accepts separate radii.

Anchor and alignment pairs instead use dimensionless fractions from 0 to 1 or the keywords start/center/end: anchor={['end', 0.5]}. Box alignment also allows fill and stretch. Stack align/justify remain single-axis values. See Positioning for the distinction between placing an element and arranging its contents.

pos also accepts named numeric records in a projected Graph, such as pos={{theta: pi / 4, r: 1}}. The callback receives every supplied dimension. Local Cartesian positions require both components, and an omitted pos uses the parent's unpositioned behavior. Projected marks accept the same records, including {x, y, z} for a projection that reduces three dimensions to two. Line, HLine, VLine, Polyline, and Polygon use ambient coordinates automatically. Set space="local" for local geometry or space="data" to require a coordinate context. UnitLine and Triangle retain local defaults. Sizes stay Cartesian.

Array helpers can feed point lists directly:

const xs = linspace(0, tau, 33) return <Plot> <Polyline points={zip(xs, xs.map(sin))} /> <Points points={xs.map(x => [x, cos(x)])} /> </Plot>

Null and nonfinite coordinates keep their existing gap behavior: lines and fills split their paths, and Points omits missing markers. Inferred limits ignore these gaps. Every numeric dimension is checked, including dimensions a projection does not use. Malformed tuples and nonnumeric named dimensions raise an error.

Points callbacks receive the complete readonly source record; tuple inputs become {x, y}. For example, point-size={({r}) => px(2 * r)} can use a named polar radius before projection. Runtime mutation protection follows the host's immutability setting. Field shape callbacks likewise receive records in sample.point and sample.vector. Callbacks keep original input indices and execute once at construction. Parametric f(t) samples preserve arbitrary numeric records. Cartesian vector helpers, spline helpers, and resolved coordinate mapping continue to return {x, y} records.

In TypeScript, PointValue is the numeric input union and PositionValue also allows px/em coordinates. For a separately declared array, annotate its point type or use as const to retain tuple lengths:

import { Points, Line, px } from '@gum-jsx/core' import type { PointValue, PositionValue } from '@gum-jsx/core' const data: PointValue[] = [[0, 1], [2, 3]] const endpoint: PositionValue = [px(12), 0.5] const markers = new Points({ points: data }) const line = new Line({ from: endpoint, to: [1, 0.5] })

Use Coordinate for numeric records, CoordinateValue for numeric records or tuples, and CoordinatePosition for projected inputs that may also contain local Cartesian lengths. Points infers callback field types from its input points; SymPoints callbacks use numeric Coordinate records.