Config
image

annotation[type=image]

์ด๋ฏธ์ง€ ์–ด๋…ธํ…Œ์ด์…˜.
type์€ 'image'์ด๋‹ค.

Class selectors

  • 'rct-image-annotation'ย 

Options

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

์ˆ˜ํ‰ ๋ฐฐ์น˜.

  • 'center' ์˜์—ญ ๊ฐ€์šด๋ฐ๋กœ ์ •๋ ฌํ•œ๋‹ค.
  • 'left' ์™ผ์ชฝ์œผ๋กœ ์ •๋ ฌํ•œ๋‹ค.
  • 'right' ์˜ค๋ฅธ์ชฝ์œผ๋กœ ์ •๋ ฌํ•œ๋‹ค.

default :'left'anchor๊ฐ€ ์ง€์ •๋˜๋ฉด 'center', ์•„๋‹ˆ๋ฉด 'left'

anchor: string

์–ด๋…ธํ…Œ์ด์…˜ ๋ฐฐ์น˜ ๊ธฐ์ค€์ด ๋˜๋Š” ์ฐจํŠธ ๊ตฌ์„ฑ ์š”์†Œ.
ํ˜„์žฌ, ๊ฐ™์€ ์˜์—ญ(body ํ˜น์€ chart)์— ํฌํ•จ๋œ ๊ฒŒ์ด์ง€๋‚˜ ๋‹ค๋ฅธ ์–ด๋…ธํ…Œ์ด์…˜์˜ ์ด๋ฆ„์„ ์ง€์ •ํ•  ์ˆ˜ ์žˆ๋‹ค.

backgroundStyle: SVGStyles|string

๋ฐฐ๊ฒฝ ์Šคํƒ€์ผ.
๊ฒฝ๊ณ„ ๋ฐ ๋ฐฐ๊ฒฝ ์ƒ‰, padding ์Šคํƒ€์ผ์„ ์ง€์ •ํ•  ์ˆ˜ ์žˆ๋‹ค.

front: boolean

true๋กœ ์ง€์ •ํ•˜๋ฉด ์‹œ๋ฆฌ์ฆˆ๋‚˜ ๊ฒŒ์ด์ง€๋“ค ์œ„์— ํ‘œ์‹œ๋œ๋‹ค.

default :false

height: string|number

Annotation ๋†’์ด.
ํ”ฝ์…€ ๋‹จ์œ„์˜ ๊ณ ์ • ๊ฐ’์ด๋‚˜, plot ์˜์—ญ์— ๋Œ€ํ•œ ์ƒํƒœ ํฌ๊ธฐ๋กค ์ง€์ •ํ•  ์ˆ˜ ์žˆ๋‹ค.

imageUrl: string

์ด๋ฏธ์ง€ ๊ฒฝ๋กœ.

name: string

์–ด๋…ธํ…Œ์ด์…˜ ์ด๋ฆ„.
๋™์ ์œผ๋กœ ์–ด๋…ธํ…Œ์ด์…˜์„ ๋‹ค๋ฃจ๊ธฐ ์œ„ํ•ด์„œ๋Š” ๋ฐ˜๋“œ์‹œ ์ง€์ •ํ•ด์•ผ ํ•œ๋‹ค.

default :false

noClip: boolean

true๋กœ ์ง€์ •ํ•˜๋ฉด ์ƒ์œ„ ์˜์—ญ์„ ๋ฒ—์–ด๋‚œ ๋ถ€๋ถ„๋„ ํ‘œ์‹œ๋˜๊ฒŒ ํ•œ๋‹ค.
body์— ํฌํ•จ๋œ ๊ฒฝ์šฐ body ์˜์—ญ, chart์— ํฌํ•จ๋˜๊ณ  scope์ด 'chart'์ผ ๋•Œ chart ์˜์—ญ.

offsetX: string|number

align๊ณผ verticalAlign์œผ๋กœ ์ง€์ •๋œ ์œ„์น˜์—์„œ ์‹ค์ œ ํ‘œ์‹œ๋  ์œ„์น˜์˜ ์ˆ˜ํ‰ ๊ฐ„๊ฒฉ.
๊ฐ’์ด ์–‘์ˆ˜์ผ ๋•Œ, anchor๊ฐ€ ์ง€์ •๋œ ๊ฒฝ์šฐ anchor ์•„์ดํ…œ์œผ ๋ฐ–์œผ๋กœ ๋ฉ€์–ด์ง€๊ณ , ์•„๋‹ˆ๋ฉด ์˜์—ญ ๊ฒฝ๊ณ„ ์•ˆ์ชฝ์œผ๋กœ ๋ฉ€์–ด์ง„๋‹ค. ๋˜, anchor๊ฐ€ ์ง€์ •๋œ ๊ฒฝ์šฐ '0.5w' ๋“ฑ์œผ๋กœ ์ด ์–ด๋…ธํ…Œ์ด์…˜์˜ ๋„ˆ๋น„๋ฅผ ๊ธฐ์ค€์œผ๋กœ ํ•œ ํฌ๊ธฐ๋กœ ์ง€์ •ํ•  ์ˆ˜ ์žˆ๋‹ค.

default :0

offsetY: string|number

align๊ณผ verticalAlign์œผ๋กœ ์ง€์ •๋œ ์œ„์น˜์—์„œ ์‹ค์ œ ํ‘œ์‹œ๋  ์œ„์น˜์˜ ์ˆ˜์ง ๊ฐ„๊ฒฉ.
๊ฐ’์ด ์–‘์ˆ˜์ผ ๋•Œ, anchor๊ฐ€ ์ง€์ •๋œ ๊ฒฝ์šฐ anchor ์•„์ดํ…œ์œผ ๋ฐ–์œผ๋กœ ๋ฉ€์–ด์ง€๊ณ , ์•„๋‹ˆ๋ฉด ์˜์—ญ ๊ฒฝ๊ณ„ ์•ˆ์ชฝ์œผ๋กœ ๋ฉ€์–ด์ง„๋‹ค. ๋˜, anchor๊ฐ€ ์ง€์ •๋œ ๊ฒฝ์šฐ '0.5h' ์ฒ˜๋Ÿผ ์ด ์–ด๋…ธํ…Œ์ด์…˜์˜ ๋„ˆ๋น„๋ฅผ ๊ธฐ์ค€์œผ๋กœ ํ•œ ํฌ๊ธฐ๋กœ ์ง€์ •ํ•  ์ˆ˜ ์žˆ๋‹ค.

default :0

rotation: number

ํšŒ์ „ ๊ฐ๋„.
0 ~ 360 ์‚ฌ์ด์˜ ๊ฐ’์œผ๋กœ ์ง€์ •ํ•œ๋‹ค.

scope: 'chart'|'container'

์–ด๋…ธํ…Œ์ด์…˜ ๋ฐฐ์น˜ ๊ธฐ์ค€.
[์ฃผ์˜]body์— ์„ค์ •๋œ annoation์—๋Š” ์ ์šฉ๋˜์ง€ ์•Š๋Š”๋‹ค.

  • 'chart' container์—์„œ padding์„ ์ ์šฉํ•œ ์˜์—ญ์„ ๊ธฐ์ค€์œผ๋กœ ํ‘œ์‹œํ•œ๋‹ค.
  • 'container' container ์ „์ฒด ์˜์—ญ์„ ๊ธฐ์ค€์œผ๋กœ ํ‘œ์‹œํ•œ๋‹ค.

default :'chart'

style: SVGStyles|string

์Šคํƒ€์ผ์…‹ ํ˜น์€ class selector.

type: 'image'

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

์ˆ˜์ง ๋ฐฐ์น˜.

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

default :top

visible: boolean

true๋กœ ์„ค์ •๋˜๊ณ  url์ด ์„ค์ •๋œ ๊ฒฝ์šฐ์—๋งŒ ํ‘œ์‹œ๋œ๋‹ค.

default :true

width: string|number

Annotation ๋„ˆ๋น„.
ํ”ฝ์…€ ๋‹จ์œ„์˜ ๊ณ ์ • ๊ฐ’์ด๋‚˜, plot ์˜์—ญ์— ๋Œ€ํ•œ ์ƒํƒœ ํฌ๊ธฐ๋กค ์ง€์ •ํ•  ์ˆ˜ ์žˆ๋‹ค.

x1: number|Date

body ์–ด๋…ธํ…Œ์ด์…˜์ผ ๊ฒฝ์šฐ, x ์ถ•์„ ๊ธฐ์ค€์œผ๋กœ ์ง€์ •ํ•˜๋Š” ์ˆ˜ํ‰(inverted์ผ ๋•Œ ์ˆ˜์ง) ์œ„์น˜.
chart์— ์ง€์ •๋œ ์–ด๋…ธํ…Œ์ด์…˜์—์„œ๋Š” ๋ฌด์‹œ๋œ๋‹ค.

x2: number|Date

body ์–ด๋…ธํ…Œ์ด์…˜์ผ ๊ฒฝ์šฐ, x ์ถ•์„ ๊ธฐ์ค€์œผ๋กœ ์ง€์ •ํ•˜๋Š” ์ˆ˜ํ‰(inverted์ผ ๋•Œ ์ˆ˜์ง) ์œ„์น˜.
chart์— ์ง€์ •๋œ ์–ด๋…ธํ…Œ์ด์…˜์—์„œ๋Š” ๋ฌด์‹œ๋œ๋‹ค.

y1: number|Date

body ์–ด๋…ธํ…Œ์ด์…˜์ผ ๊ฒฝ์šฐ, y ์ถ•์„ ๊ธฐ์ค€์œผ๋กœ ์ง€์ •ํ•˜๋Š” ์ˆ˜์ง(inverted์ผ ๋•Œ ์ˆ˜ํ‰) ์œ„์น˜.
chart์— ์ง€์ •๋œ ์–ด๋…ธํ…Œ์ด์…˜์—์„œ๋Š” ๋ฌด์‹œ๋œ๋‹ค.

y2: number|Date

body ์–ด๋…ธํ…Œ์ด์…˜์ผ ๊ฒฝ์šฐ, y ์ถ•์„ ๊ธฐ์ค€์œผ๋กœ ์ง€์ •ํ•˜๋Š” ์ˆ˜์ง(inverted์ผ ๋•Œ ์ˆ˜ํ‰) ์œ„์น˜.
chart์— ์ง€์ •๋œ ์–ด๋…ธํ…Œ์ด์…˜์—์„œ๋Š” ๋ฌด์‹œ๋œ๋‹ค.