API
ShapeAnnotationOptions

ShapeAnnotationOptions extends AnnotationOptions

Shape 어노테이션.
type'shape'이다.
shape 속성에 표시할 도형 모양을 지정하거나, path에 SVG path를 직접 지정할 수 있다.
shape'arrow'이고 object style일 때 stroke/fill 기본값이 자동 보정된다.
CSS class style 문자열은 자동 보정되지 않는다.

Options

align: 'center' | 'left' | 'right'

수평 배치.

  • 'center' 영역 가운데로 정렬한다.
  • 'left' 왼쪽으로 정렬한다.
  • 'right' 오른쪽으로 정렬한다.

default :'left'anchor가 지정되면 'center', 아니면 'left'

anchor: string (opens in a new tab)

어노테이션 배치 기준이 되는 차트 구성 요소.
현재, 같은 영역(body 혹은 chart)에 포함된 다른 어노테이션이나 게이지 이름을 지정할 수 있다.

default :undefined

backgroundStyle: SVGStyles | string (opens in a new tab)

배경 스타일.
경계 및 배경 색, padding 스타일을 지정할 수 있다.

default :undefined

col: number (opens in a new tab)

분할 모드일 때 이 속성과 row가 모두 지정되면 annotation이 표시될 pane의 수직 index.

default :undefined

front: boolean (opens in a new tab)

true로 지정하면 시리즈나 게이지들 위에 표시된다.

default :false

headSize: number (opens in a new tab)

shape'arrow'일 때 화살표 머리 크기(픽셀).
tip에서 wing까지의 거리이며, 선 길이의 90%를 넘지 않는다.
arrow가 아닌 shape에서는 무시된다.

default :12

height: string (opens in a new tab) | number (opens in a new tab)

default :64

lineWidth: number (opens in a new tab)

shape'arrow'일 때 선 굵기(픽셀).
지정하면 style의 strokeWidth보다 우선하며, 렌더 시 style strokeWidth로 반영된다.
arrow 전용이며, object style 미지정 시 strokeWidth 기본값도 함께 적용된다.

default :1

name: string (opens in a new tab)

어노테이션 이름.
동적으로 어노테이션을 다루기 위해서는 반드시 지정해야 한다.

default :false

noClip: boolean (opens in a new tab)

body의 annotation으로 설정된 경우, true로 지정하면 상위 영역을 벗어난 부분도 표시되게 한다.

default :undefined

offsetX: string (opens in a new tab) | number (opens in a new tab)

alignverticalAlign으로 지정된 위치에서 실제 표시될 위치의 수평 간격.
값이 양수일 때, anchor가 지정된 경우 anchor 아이템으 밖으로 멀어지고, 아니면 영역 경계 안쪽으로 멀어진다. 또, anchor가 지정된 경우 '0.5w' 등으로 이 어노테이션의 너비를 기준으로 한 크기로 지정할 수 있다.

default :0

offsetY: string (opens in a new tab) | number (opens in a new tab)

alignverticalAlign으로 지정된 위치에서 실제 표시될 위치의 수직 간격.
값이 양수일 때, anchor가 지정된 경우 anchor 아이템으 밖으로 멀어지고, 아니면 영역 경계 안쪽으로 멀어진다. 또, anchor가 지정된 경우 '0.5h' 처럼 이 어노테이션의 너비를 기준으로 한 크기로 지정할 수 있다.

default :0

path: string (opens in a new tab)

shape svg path.
이 속성이 지정되면 shape는 무시되며, 'arrow'일 때 화살표 머리도 표시되지 않는다.

default :undefined

rotation: number (opens in a new tab)

회전 각도.
0 ~ 360 사이의 값으로 지정한다.

default :undefined

row: number (opens in a new tab)

분할 모드일 때 이 속성과 col이 모두 지정되면 annotation이 표시될 pane의 수직 index.

default :undefined

scope: 'chart' | 'container'

어노테이션 배치 기준.
[주의]body에 설정된 annoation에는 적용되지 않는다.

  • 'chart' container에서 padding을 적용한 영역을 기준으로 표시한다.
  • 'container' container 전체 영역을 기준으로 표시한다.

default :'chart'

series: string (opens in a new tab)

  • ⚠️ Deprecated

default :undefined

shape: 'arrow' | 'circle' | 'diamond' | 'hline' | 'itriangle' | 'line' | 'rectangle' | 'square' | 'star' | 'triangle' | 'vline'

Shape 종류.
'arrow'x1, y1, x2, y2 직선 화살표이며, 'hline'/'vline'처럼 축 전체를 span하지 않는다.

  • 'arrow' 화살표
  • 'circle'
  • 'diamond' 다아이몬드
  • 'hline' 수평선
  • 'itriangle' 역삼각형
  • 'line' 직선
  • 'rectangle' 직사각형
  • 'square' 정사각형
  • 'star' 별 모양
  • 'triangle' 삼각형
  • 'vline' 수직선

default :'square'

style: SVGStyles | string (opens in a new tab)

스타일셋 또는 css selector (opens in a new tab).

default :undefined

type: 'shape'

default :undefined

verticalAlign: 'bottom' | 'middle' | 'top'

수직 배치.

  • 'bottom'
  • 'middle'
  • 'top'

default :top

visible: boolean (opens in a new tab)

표시 여부.

default :true

width: string (opens in a new tab) | number (opens in a new tab)

default :64

x1: number (opens in a new tab) | Date (opens in a new tab)

body 어노테이션일 경우, x 축을 기준으로 지정하는 수평(inverted일 때 수직) 위치.
chart에 지정된 어노테이션에서는 무시된다.

default :undefined

x2: number (opens in a new tab) | Date (opens in a new tab)

body 어노테이션일 경우, x 축을 기준으로 지정하는 수평(inverted일 때 수직) 위치.
chart에 지정된 어노테이션에서는 무시된다.

default :undefined

xAxis: string (opens in a new tab) | number (opens in a new tab)

body 어노테이션일 때, x1, x2의 기준이 되는 축의 index나 이름.
지정하지 않으면 body에 연결된 첫번째 x축, 또는 body에 표시되는 첫번째 시리즈의 x축이 기준이 된다.

default :undefined

xRange: Array (opens in a new tab)<number (opens in a new tab)>

  • ⚠️ Deprecated

default :undefined

y1: number (opens in a new tab) | Date (opens in a new tab)

body 어노테이션일 경우, y 축을 기준으로 지정하는 수직(inverted일 때 수평) 위치.
chart에 지정된 어노테이션에서는 무시된다.

default :undefined

y2: number (opens in a new tab) | Date (opens in a new tab)

body 어노테이션일 경우, y 축을 기준으로 지정하는 수직(inverted일 때 수평) 위치.
chart에 지정된 어노테이션에서는 무시된다.

default :undefined

yAxis: string (opens in a new tab) | number (opens in a new tab)

body 어노테이션일 때, y1, y2의 기준이 되는 축의 index나 이름.
지정하지 않으면 body에 연결된 첫번째 y축, 또는 body에 표시되는 첫번째 시리즈의 y축이 기준이 된다.

default :undefined

yRange: Array (opens in a new tab)<number (opens in a new tab)>

  • ⚠️ Deprecated

default :undefined