Documentation Index
Fetch the complete documentation index at: https://docs.tsdraw.com/llms.txt
Use this file to discover all available pages before exploring further.
ShapeId
Unique identifier for each shape, generated by the engine at creation time.
Vec3
interface Vec3 {
x: number
y: number
z?: number
}
z field ranges from 0 to 1 and is present when drawn with a pressure-sensitive stylus.
DrawSegment
interface DrawSegment {
type: SegmentType
path: string
}
type SegmentType = 'free' | 'straight'
path field is a base64-encoded buffer of Vec3 points.
DrawShape
interface DrawShape {
id: ShapeId
type: 'draw'
x: number
y: number
props: {
color: ColorStyle
dash: DashStyle
fill: FillStyle
size: SizeStyle
scale: number
isPen: boolean
isComplete: boolean
segments: DrawSegment[]
isClosed: boolean
}
}
Style types
type SizeStyle = 's' | 'm' | 'l' | 'xl'
type DashStyle = 'draw' | 'solid' | 'dashed' | 'dotted'
type FillStyle = 'none' | 'semi' | 'solid' | 'blank'
type ColorStyle = string
Shape type union
Currently, DrawShape is the only shape type. Additional types may be added in future versions.
Constants
| Constant | Value | Description |
|---|
STROKE_WIDTHS | { s: 2, m: 3.5, l: 5, xl: 10 } | Pixel widths for each size |
DRAG_DISTANCE_SQUARED | 36 | Threshold for click vs drag detection |
MAX_POINTS_PER_SHAPE | 200 | Maximum points per shape before a new segment starts |
DEFAULT_COLORS | Record of 13 colors | Built-in color palette |
Path codec utilities
import { encodePoints, decodePoints, decodeFirstPoint, decodeLastPoint } from '@tsdraw/core'
const encoded = encodePoints(points: Vec3[]): string
const decoded = decodePoints(encoded: string): Vec3[]
const first = decodeFirstPoint(encoded: string): Vec3
const last = decodeLastPoint(encoded: string): Vec3
