DrawingControl

Type class

A drawing tools control for StockChart.

Click here for more info

Sources

DrawingControl can be used (imported) via one of the following packages.

// Import DrawingControl
import * as am5stock from "@amcharts/amcharts5/stock";

// Create DrawingControl
am5stock.DrawingControl.new(root, {
  // ... config if applicable
});
<!-- Load DrawingControl -->
<script src="stock.js"></script>

<script>
// Create DrawingControl
am5stock.DrawingControl.new(root, {
  // ... config if applicable
});
</script>

Inheritance

DrawingControl extends StockControl.

DrawingControl is not extended by any other symbol.

Settings

Set these settings on a DrawingControl object using its set() and setAll() methods.

Read about settings concept.

active
#

Type undefined | false | true

Default false

Inherited from IStockControlSettings

Indicates if control is active.

align
#

Type "left" | "right"

Default "left"

Inherited from IStockControlSettings

Alignment of the control in a toolbar.

colors
#

Type ColorSet

Colors to show in color pickers.

Click here for more info

description
#

Type undefined | string

Inherited from IStockControlSettings

Description of what the button does.

drawingIcon
#

Type IIcon

drawingIcons
#

Type IIcon[]

fillColor
#

Type Color

Default fill color.

fillOpacity
#

Type undefined | number

Default fill opacity.

forceHidden
#

Type undefined | false | true

Inherited from IStockControlSettings

Force this control to always be invisible.

@since 5.8.5
@defaul false

icon
#

Type HTMLElement | SVGElement | "none"

Inherited from IStockControlSettings

An element with control icon. If not set, each control will aytomatically create an icon.

id
#

Type undefined | string

Inherited from IEntitySettings

A custom string ID for the element.

If set, element can be looked up via am5.registry.entitiesById.

Will raise error if an element with the same ID already exists.

labelFill
#

Type Color

Default color for labels.

labelFontFamilies
#

Type string[]

Available fonts for user to choose from.

labelFontFamily
#

Type undefined | string

Default label font.

labelFontSize
#

Type number | string | undefined

Default label font size.

labelFontSizes
#

Type Array

Available font sizes.

labelFontStyle
#

Type "normal" | "italic" | "oblique"

Default label style.

labelFontWeight
#

Type "normal" | "bold" | "bolder" | "lighter" | "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900"

Default label font weight.

name
#

Type undefined | string

Inherited from IStockControlSettings

Name of the control. Used for the label.

scrollable
#

Type undefined | false | true

If set to true, the dropdown will fix the height to fit within chart's area, with scroll if the contents do not fit.

@since 5.9.5

series
#

Type XYSeries[]

Target series for drawing.

showExtension
#

Type undefined | false | true

Default true

Show dotted/thin line extending from both ends of the drawn line?

snapToData
#

Type undefined | false | true

Default true

Should drawings snap to the nearest data point?

stateAnimationDuration
#

Type undefined | number

Inherited from IEntitySettings

Duration of transition from one state to another.

stateAnimationEasing
#

Type $ease.Easing

Inherited from IEntitySettings

Easing of transition from one state to another.

stockChart
#

Type StockChart

Inherited from IStockControlSettings

A StockChart the toolbar is for.

strokeColor
#

Type Color

Default color for lines/borders.

strokeDasharray
#

Type number[]

Default dasharray setting.

strokeDasharrays
#

Type number[]

Available line dash settings for user to choose from.

strokeOpacity
#

Type undefined | number

Default line/border opacity.

strokeWidth
#

Type undefined | number

Default line/border width in pixels.

strokeWidths
#

Type number[]

Available line widths for user to choose from.

themeTags
#

Type Array

Inherited from IEntitySettings

Tags which can be used by the theme rules.

Click here for more info

themeTagsSelf
#

Type Array

Inherited from IEntitySettings

Tags which can be used by the theme rules.

These tags only apply to this object, not any children.

Click here for more info

themes
#

Type Array

Inherited from IEntitySettings

A list of themes applied to the element.

togglable
#

Type undefined | false | true

Default true

Inherited from IStockControlSettings

If set to true, control can be toggle on and off by clicking on it.

tool
#

Type DrawingTools

Default tool.

toolSettings
#

Type undefined | object

Default settings for drawing tools.

@since 5.5.2
Click here for more info

tools
#

Type DrawingTools[]

List of tools available in drawing mode.

Click here for more info

userData
#

Type any

Inherited from IEntitySettings

A storage for any custom user data that needs to be associated with the element.

visible
#

Type undefined | false | true

Default true

Inherited from IStockControlSettings

Is control visible?

There are 16 inherited items currently hidden from this list.

Private settings

These are read-only settings accessible from a DrawingControl object using its getPrivate() method.

Read about private settings.

boldControl
#

Read only

Type StockControl

button
#

Read only

Type HTMLDivElement

Inherited from IStockControlPrivate

clearControl
#

Read only

Type StockControl

eraserControl
#

Read only

Type StockControl

extensionControl
#

Read only

Type StockControl

fillControl
#

Read only

Type ColorControl

icon
#

Read only

Type HTMLElement

Inherited from IStockControlPrivate

iconControl
#

Read only

Type IconControl

italicControl
#

Read only

Type StockControl

label
#

Read only

Type HTMLDivElement

Inherited from IStockControlPrivate

labelFillControl
#

Read only

Type ColorControl

labelFontFamilyControl
#

Read only

Type DropdownListControl

labelFontSizeControl
#

Read only

Type DropdownListControl

selectControl
#

Read only

Type StockControl

Selector mode toggler.

@since 5.9.1

snapControl
#

Read only

Type StockControl

strokeControl
#

Read only

Type ColorControl

strokeDasharrayControl
#

Read only

Type DropdownListControl

strokeWidthControl
#

Read only

Type DropdownListControl

toolControl
#

Read only

Type DrawingToolControl

toolTemplates
#

Read only

Type undefined | object

toolbar
#

Read only

Type StockToolbar

Inherited from IStockControlPrivate

toolsContainer
#

Read only

Type HTMLDivElement

There are 4 inherited items currently hidden from this list.

Properties

adapters
#

Type Adapters

Default new Adapters(this)

Inherited from Entity

className
#

Static

Type string

Default "DrawingControl"

classNames
#

Static

Type Array

Default "DrawingControl", "StockControl", "Entity"

drawingSeries
#

Type object

Returns an object that holds all drawing series, arrange by tool (key).

@since 5.8.0
@readonly

events
#

Type EventDispatcher

Default this._createEvents()

Inherited from Entity

root
#

Type Root

Inherited from Entity

An instance of Root object.

@readonly
@since 5.0.6

states
#

Type States

Default new States(this)

Inherited from Entity

template
#

Type Template | undefined

Inherited from Entity

@todo needs description

uid
#

Type number

Default ++counter

Inherited from Settings

Unique ID.

There are 6 inherited items currently hidden from this list.

Methods

animate(

options: AnimationOptions

)

#

Returns Animation

Inherited from Settings

Animates setting values from current/start values to new ones.

Click here for more info

clearDrawings()

#

Returns void

Clears all drawings.

@since 5.3.9

dispose()

#

Returns void

Inherited from Settings

Disposes this object.

get(

key: Key,
fallback: F

)

#

Returns NonNullable | F

Inherited from Entity

Returns settings value for the specified key.

If there is no value, fallback is returned instead (if set).

Click here for more info

has(

key: Key

)

#

Returns boolean

Inherited from Settings

Returns true if the setting exists.

Click here for more info

hide()

#

Returns void

Inherited from StockControl

isAccessible()

#

Returns boolean

Inherited from StockControl

isDisposed()

#

Returns boolean

Inherited from Settings

Returns true if this element is disposed.

isType(

type: string

)

#

Returns this

Inherited from Entity

Checks if element is of certain class (or inherits one).

new(

root: Root,
settings: ITSettings,
template?: Template

)

#

Static

Returns T

Inherited from Entity

Use this method to create an instance of this class.

Click here for more info

off(

key: Key,
callback?: undefined | ( value: [""], target: this, key: Key) => void

)

#

Returns void

Inherited from Settings

Removes a callback for when value of a setting changes.

Click here for more info
@since 5.9.2

offPrivate(

key: Key,
callback?: undefined | ( value: [""], target: this, key: Key) => void

)

#

Returns void

Inherited from Settings

Removes a callback for when value of a private setting changes.

Click here for more info
@since 5.9.2

on(

key: Key,
callback: ( value: [""], target: this, key: Key) => void

)

#

Returns IDisposer

Inherited from Settings

Sets a callback function to invoke when specific key of settings changes or is set.

Click here for more info

onPrivate(

key: Key,
callback: ( value: [""], target: this, key: Key) => void

)

#

Returns IDisposer

Inherited from Settings

Sets a callback function to invoke when specific key of private settings changes or is set.

Click here for more info

remove(

key: Key

)

#

Returns void

Inherited from Entity

Removes a setting value for the specified key.

Click here for more info

removeAll()

#

Returns void

Inherited from Settings

Removes all keys;

Click here for more info

serializeDrawings(

output: "object" | "string",
indent?: undefined | string

)

#

Returns Array | string

Serializes all drawings into an array of simple objects or JSON.

output parameter can either be "object" or "string" (default).

Click here for more info
@since 5.3.0

set(

key: Key,
value: Value

)

#

Returns Value

Inherited from Entity

Sets a setting value for the specified key, and returns the same value.

Click here for more info

setAll(

settings: Partial

)

#

Returns void

Inherited from Settings

Sets multiple settings at once.

settings must be an object with key: value pairs.

Click here for more info

setEraser(

active: boolean

)

#

Returns void

Enables or disables eraser mode.

@since 5.3.9

setTimeout(

fn: () => void,
delay: number

)

#

Returns IDisposer

Inherited from Entity

Creates and returns a "disposable" timeout.

show()

#

Returns void

Inherited from StockControl

unserializeDrawings(

data: string | Array

)

#

Returns void

Parses data serialized with serializeDrawings() and adds drawings to the chart.

Click here for more info
@since 5.3.0

There are 19 inherited items currently hidden from this list.

Events

Add event handlers to DrawingControl object using its events.on() method.

Read about adding event handlers.

#click

Param { originalEvent: IPointerEvent,
  type: "click",
  target: this }

Inherited from IStockControlEvents

There is 1 inherited item currently hidden from this list.