TLGeoUtil

Public Class

Table of Contents
Signature
class TLGeoUtil extends TLBoxUtil<TLGeoShape> {}
References

TLBoxUtil, TLGeoShape


Properties

canEdit

Public Property

Signature
canEdit: () => boolean

onBeforeCreate

Public Property

Signature
onBeforeCreate: (shape: TLGeoShape) =>
  | {
      props: {
        growY: number
        geo:
          | 'arrow-down'
          | 'arrow-left'
          | 'arrow-right'
          | 'arrow-up'
          | 'check-box'
          | 'diamond'
          | 'ellipse'
          | 'hexagon'
          | 'octagon'
          | 'oval'
          | 'pentagon'
          | 'rectangle'
          | 'rhombus-2'
          | 'rhombus'
          | 'star'
          | 'trapezoid'
          | 'triangle'
          | 'x-box'
        labelColor:
          | 'black'
          | 'blue'
          | 'green'
          | 'grey'
          | 'light-blue'
          | 'light-green'
          | 'light-red'
          | 'light-violet'
          | 'orange'
          | 'red'
          | 'violet'
          | 'yellow'
        color:
          | 'black'
          | 'blue'
          | 'green'
          | 'grey'
          | 'light-blue'
          | 'light-green'
          | 'light-red'
          | 'light-violet'
          | 'orange'
          | 'red'
          | 'violet'
          | 'yellow'
        fill: 'none' | 'pattern' | 'semi' | 'solid'
        dash: 'dashed' | 'dotted' | 'draw' | 'solid'
        size: 'l' | 'm' | 's' | 'xl'
        opacity: '0.1' | '0.25' | '0.5' | '0.75' | '1'
        font: 'draw' | 'mono' | 'sans' | 'serif'
        align: 'end' | 'middle' | 'start'
        url: string
        w: number
        h: number
        text: string
      }
      type: 'geo'
      x: number
      y: number
      rotation: number
      index: string
      parentId: import('@tldraw/tlschema').TLParentId
      isLocked: boolean
      id: import('@tldraw/tlstore').ID<TLGeoShape>
      typeName: 'shape'
    }
  | undefined
References

TLGeoShape, TLParentId, ID


onBeforeUpdate

Public Property

Signature
onBeforeUpdate: (
  prev: TLGeoShape,
  next: TLGeoShape
) =>
  | {
      props: {
        growY: number
        geo:
          | 'arrow-down'
          | 'arrow-left'
          | 'arrow-right'
          | 'arrow-up'
          | 'check-box'
          | 'diamond'
          | 'ellipse'
          | 'hexagon'
          | 'octagon'
          | 'oval'
          | 'pentagon'
          | 'rectangle'
          | 'rhombus-2'
          | 'rhombus'
          | 'star'
          | 'trapezoid'
          | 'triangle'
          | 'x-box'
        labelColor:
          | 'black'
          | 'blue'
          | 'green'
          | 'grey'
          | 'light-blue'
          | 'light-green'
          | 'light-red'
          | 'light-violet'
          | 'orange'
          | 'red'
          | 'violet'
          | 'yellow'
        color:
          | 'black'
          | 'blue'
          | 'green'
          | 'grey'
          | 'light-blue'
          | 'light-green'
          | 'light-red'
          | 'light-violet'
          | 'orange'
          | 'red'
          | 'violet'
          | 'yellow'
        fill: 'none' | 'pattern' | 'semi' | 'solid'
        dash: 'dashed' | 'dotted' | 'draw' | 'solid'
        size: 'l' | 'm' | 's' | 'xl'
        opacity: '0.1' | '0.25' | '0.5' | '0.75' | '1'
        font: 'draw' | 'mono' | 'sans' | 'serif'
        align: 'end' | 'middle' | 'start'
        url: string
        w: number
        h: number
        text: string
      }
      type: 'geo'
      x: number
      y: number
      rotation: number
      index: string
      parentId: import('@tldraw/tlschema').TLParentId
      isLocked: boolean
      id: import('@tldraw/tlstore').ID<TLGeoShape>
      typeName: 'shape'
    }
  | undefined
References

TLGeoShape, TLParentId, ID


onDoubleClick

Public Property

Signature
onDoubleClick: (shape: TLGeoShape) =>
  | {
      props: {
        geo: 'check-box'
      }
      type: 'geo'
      x: number
      y: number
      rotation: number
      index: string
      parentId: import('@tldraw/tlschema').TLParentId
      isLocked: boolean
      id: import('@tldraw/tlstore').ID<TLGeoShape>
      typeName: 'shape'
    }
  | {
      props: {
        geo: 'rectangle'
      }
      type: 'geo'
      x: number
      y: number
      rotation: number
      index: string
      parentId: import('@tldraw/tlschema').TLParentId
      isLocked: boolean
      id: import('@tldraw/tlstore').ID<TLGeoShape>
      typeName: 'shape'
    }
  | undefined
References

TLGeoShape, TLParentId, ID


onEditEnd

Public Property

Signature
onEditEnd: OnEditEndHandler<TLGeoShape>
References

OnEditEndHandler, TLGeoShape


onResize

Public Property

Signature
onResize: OnResizeHandler<TLGeoShape>
References

OnResizeHandler, TLGeoShape


type

Public Static Property

Signature
static type: string

Methods

defaultProps()

Public Method

Parameters

None

Returns
TLGeoShape['props']
References

TLGeoShape


getBounds()

Public Method

Parameters
NameDescription

shape

TLGeoShape
Returns
Box2d
References

TLGeoShape, Box2d


getCenter()

Public Method

Parameters
NameDescription

shape

TLGeoShape
Returns
Vec2d
References

TLGeoShape, Vec2d


getOutline()

Public Method

Parameters
NameDescription

shape

TLGeoShape
Returns
Vec2d[]
References

TLGeoShape, Vec2d


hitTestLineSegment()

Public Method

Parameters
NameDescription

shape

TLGeoShape

A

VecLike

B

VecLike
Returns
boolean
References

TLGeoShape, VecLike


hitTestPoint()

Public Method

Parameters
NameDescription

shape

TLGeoShape

point

VecLike
Returns
boolean
References

TLGeoShape, VecLike


indicator()

Public Method

Parameters
NameDescription

shape

TLGeoShape
Returns
JSX.Element
References

TLGeoShape, JSX.Element


render()

Public Method

Parameters
NameDescription

shape

TLGeoShape
Returns
JSX.Element
References

TLGeoShape, JSX.Element


toSvg()

Public Method

Parameters
NameDescription

shape

TLGeoShape

font

string

colors

TLExportColors
Returns
SVGElement
References

TLGeoShape, TLExportColors, SVGElement


Edit this page
Last edited on 11 May 2023
TLGeoShapeDefTLGroupShapeDef