class anychart.graphics.vector.Stage Improve this Doc

This class provide tools for cross-browser display with the single interface for both (SVG and VML).
Do not invoke constructor directly. Use anychart.graphics#create.

Note:
anychart.graphics.vector.Stage delegates all work with DOM elements, style and attributes to its renderer. You can get renderer using getRenderer method.
Note: Renderer is a singleton must not contain own fields.

Rendering:
anychart.graphics.vector.Stage has the rootLayer_ private field of Layer type. All layers and elements you add to a stage go there, so rendering and other stuff happens when this layer is rendered.

Methods Overview

Specific settings
credits()	Credits settings
Size and Position
height()	Stage height setting.
resize()	Stage resize. Anything drawn on stage must fit in it.
width()	Stage width setting.
Miscellaneous
addChild()	Adds element.
addChildAt()	Adds element by index.
appendTransformationMatrix()	Combines current transformation with another.
asyncMode()	Stage rendering mode.
circle()	Invokes anychart.graphics.vector.Circle constructor.
clip()	Clips a stage.
container()	Container setting.
createClip()	Creates a clip element using single value.
cross()	Draws a cross set by it's circumscribed circle center and radius.
data()	Returns stage JSON. Serializes stage and all its object in JSON.
desc()	Description setting.
diagonalCross()	Draws a diagonal cross set by it circumscribed circle center and radius.
diamond()	Draws a diamond set by it circumscribed circle center and radius.
dispose()	Disposes stage.
domElement()	Returns stage root DOM element.
donut()	Draws arc as donut chart element.
ellipse()	Invokes anychart.graphics.vector.Ellipse constructor.
forEachChild()	Applies function to all children.
getBounds()	Returns bounds.
getChildAt()	Returns element by index.
getContainerElement()	Returns stage container element.
getDomWrapper()	Returns a DIV wrapper that contains stage and other utilitarian DOM elements.
getJpgBase64String()	Returns JPG as base64 string.
getPdfBase64String()	Returns PDF as base64 string.
getPngBase64String()	Returns PNG as base64 string.
getRotationAngle()	Returns rotation angle in degrees.
getStage()	Returns self.
getSvgBase64String()	Returns SVG as base64 string.
getTransformationMatrix()	Returns current transformation matrix: [
getX()	Returns X of top left corner.
getY()	Returns Y of top left corner.
hLine()	Draws a thick horizontal line set by it circumscribed circle center and radius.
hasChild()	Checks if there is such element in children set.
hatchFill()	Invokes anychart.graphics.vector.HatchFill constructor.
html()	Invokes anychart.graphics.vector.Text and applies anychart.graphics.vector.Text#htmlText method
id()	Stage identifier setting.
image()	Invokes anychart.graphics.vector.Image constructor.
indexOfChild()	Returns index of a child.
isRendering()	Indicates if stage is in rendering process.
isSuspended()	Returns rendering state (true - suspended, false - instant).
layer()	Invokes anychart.graphics.vector.Layer constructor
listen()	Adds an event listener to a stage.
listenOnce()	Adds an event listener to a stage
maxResizeDelay()	Getter for max delay.
numChildren()	Number of stage children.
parent()	Returns self.
path()	Invokes anychart.graphics.vector.Path constructor.
pattern()	Invokes anychart.graphics.vector.PatternFill.
pie()	Draws arc as pie chart element.
print()	Print stage.
rect()	Invokes anychart.graphics.vector.Rect constructor.
remove()	Removes everything.
removeAllListeners()	Removes all listeners from an object. You can also optionally remove listeners of some particular type.
removeChild()	Removes element.
removeChildAt()	Removes element by index.
removeChildren()	Removes all elements.
resume()	Removes suspend state and applies all changes in sync (if any).
rotate()	Rotates root layer.
rotateByAnchor()	Rotates root layer around an anchor.
saveAsJpg()	Saves the current stage as JPG Image.
saveAsPdf()	Saves the current stage as PDF Document.
saveAsPng()	Saves the current stage as PNG Image.
saveAsSvg()	Saves the stage as SVG Image.
scale()	Scales root layer in parent coordinates system. Scaling center is set in the parent system too.
scaleByAnchor()	Scales root layer in parent coordinates system. Scaling center is set by root layer anchor.
setPosition()	Sets top left corner coordinates of root layer (with transformation,in parent coordinate system).
setRotation()	Rotates root layer around a point.
setRotationByAnchor()	Rotates root layer around an anchor.
setTransformationMatrix()	Sets transformation matrix.
shareAsJpg()	Share a stage as a JPG and return link to shared image.
shareAsPdf()	Share a stage as a PDF and return link to shared image.
shareAsPng()	Shares a stage as a PNG file and returns a link to the shared image.
shareAsSvg()	Share a stage as a SVG and return link to shared image.
star()	Draws multi-pointed star.
star10()	Draws ten-pointed star.
star4()	Draws four-pointed star.
star5()	Draws five-pointed star.
star6()	Draws six-pointed star.
star7()	Draws seven-pointed star.
suspend()	Suspends rendering (changes instant to suspended).
swapChildren()	Swaps two children.
swapChildrenAt()	Swaps two children by id.
text()	Invokes anychart.graphics.vector.Text constructor.
title()	Title setting.
toSvg()	Returns SVG string
translate()	Moves root layer taking transformation into account.
triangleDown()	Draws a triangle heading downwards set by it circumscribed circle center and radius.
triangleLeft()	Draws a triangle heading leftwards set by it circumscribed circle center and radius.
triangleRight()	Draws a triangle heading rightwards set by it circumscribed circle center and radius.
triangleUp()	Draws a triangle heading upwards set by its circumscribed circle center and radius.
unlisten()	Removes a listener added with listen() or listenOnce() methods.
unlistenByKey()	Removes an event listener which was added with listen() by the key returned by listen() or listenOnce().
vLine()	Draws a thick vertical line set by it circumscribed circle center and radius.
visible()	Stage visibility setting.

Methods Description

addChild

addChild(element)

Adds element.
Similar to anychart.graphics.vector.Layer#addChild

Params:

Name	Type	Description
element	anychart.graphics.vector.Element	Element.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

addChildAt

addChildAt(element, index)

Adds element by index.
Similar to anychart.graphics.vector.Layer#addChildAt

Params:

Name	Type	Description
element	anychart.graphics.vector.Element	Element.
index	number	Child index.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

appendTransformationMatrix

appendTransformationMatrix(m00, m10, m01, m11, m02, m12)

Combines current transformation with another.
Combination is done by multiplying matrix to the right.
Read more at: anychart.graphics.vector.Element#appendTransformationMatrix.

Params:

Name	Type	Description
m00	number	Scale X.
m10	number	Shear Y.
m01	number	Shear X.
m11	number	Scale Y.
m02	number	Translate X.
m12	number	Translate Y.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

asyncMode

asyncMode()

Getter for the current stage rendering mode.

Returns:

boolean - The current mode.

See listing

var stage = anychart.graphics.create("container");
stage.asyncMode();

asyncMode(value)

Setter for the stage rendering mode.

Detailed description

If set to true - stage is rendered in async manner allowing the page to interact while the rendering is in process. In this mode you should listen the RENDER_FINISH or STAGE_RENDERED event on the stage. To control the suspension of rendering, always use anychart.graphics.vector.Stage#suspend and anychart.graphics.vector.Stage#resume.

Params:

Name	Type	Default	Description
value	boolean	false	Value to set.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining

Try it:

Usage sample

circle

circle(cx, cy, radius)

Invokes anychart.graphics.vector.Circle constructor.
Note:
anychart.graphics.vector.Stage doesn't delete objects you create. You must delete them yourself after you finish using them.
Read more at: anychart.graphics.vector.Circle

Params:

Name	Type	Description
cx	number	Center X, in pixels.
cy	number	Center Y, in pixels.
radius	number	Radius, in pixels.

Returns:

anychart.graphics.vector.Circle - An instance of the class for method chaining.

Try it:

Usage sample

clip

clip(value)

Clips a stage.
Works only after render() is invoked.
Read more at: anychart.graphics.vector.Element#clip.

Params:

Name	Type	Description
value	anychart.graphics.math.Rect	Clipping rectangle.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

clip()

Gets clip bounds.
Works only after render() is invoked.
Read more at: anychart.graphics.vector.Element#clip.

Returns:

anychart.graphics.math.Rect - Clipping rectangle.

container

container()

Returns DOM element where everything is drawn upon rendering.

Returns:

Element - Returns DOM element of graphics container.

Try it:

Usage sample

container(value)

Sets DOM element where everything is drawn upon rendering.

Detailed description

If method is invoked after rendering and new container is set then upon next draw DOM element will move to the new container.

Params:

Name	Type	Description
value	Element	Container DOM element.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

Try it:

Usage sample

createClip

createClip(rect)

Creates a clip element using single value.

Params:

Name	Type	Description
rect	Array.<number> \| anychart.graphics.math.Rect \| Object \| null	Rect or array or object representing bounds.

Returns:

anychart.graphics.vector.Clip - Clip element.

Try it:

Usage sample

createClip(left, top, width, height)

Creates a clip element using several value.

Params:

Name	Type	Description
left	number	Left coordinate of bounds.
top	number	Top coordinate.
width	number	Width of the rect.
height	number	Height of the rect.

Returns:

anychart.graphics.vector.Clip - Clip element.

Try it:

Usage sample

credits

credits()Since version 7.11.1

Getter for stage credits.

Returns:

anychart.core.ui.StageCredits - Credits instance.

Try it:

Usage sample

credits(value)Since version 7.11.1

Setter for stage credits. Learn more about credits settings.

Detailed description

Note: You can't customize credits without a license key. See AnyChart Licensing to learn more.
Works only with AnyChart product
Sets stage credits settings depending on parameter type:

null/boolean - disable or enable chart credits.
object - sets chart credits settings.

Params:

Name	Type	Description
value	Object \| boolean \| null	Credits settings.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

Try it:

cross

cross()

Draws a cross set by it's circumscribed circle center and radius.
Read more at anychart.graphics.vector.primitives#cross

Try it:

Usage sample

data

data()

Returns stage JSON. Serializes stage and all its object in JSON.

Returns:

Object - JSON data of stage.

Try it:

Usage sample

data(value)

Deserialize JSON. Objects are created and rendered to the current stage.
Note: All settings except events and handlers are serialized. JSON object must be conformed with JSON schema (can be found in the project root). No checks are done when we deserialize - JSON schema does this. JSON schema is created in 4-th version of standard JSON schema.

Params:

Name	Type	Description
value	Object	JSON data to set for stage.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

desc

desc()Since version 7.11.0

Getter for the element description value.

Returns:

string | null | undefined - The element description value.

Try it:

Usage sample

desc(value)Since version 7.11.0

Setter for the element desc value.

Params:

Name	Type	Description
value	string \| null	Value to set.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

Try it:

Usage sample

diagonalCross

diagonalCross()

Draws a diagonal cross set by it circumscribed circle center and radius.
Read more at anychart.graphics.vector.primitives#diagonalCross

Try it:

Usage sample

diamond

diamond()

Draws a diamond set by it circumscribed circle center and radius.
Read more at anychart.graphics.vector.primitives#diamond

Try it:

Usage sample

dispose

dispose()

Disposes stage.
Removes it from parent layer, nulls links, removes from DOM.

Try it:

Usage sample

domElement

domElement()

Returns stage root DOM element.

Returns:

Element - Stage root DOM element.

Try it:

Usage sample

donut

donut()

Draws arc as donut chart element.
Read more at anychart.graphics.vector.primitives#donut

Try it:

Usage sample

ellipse

ellipse(cx, cy, rx, ry)

Invokes anychart.graphics.vector.Ellipse constructor.
Note:
anychart.graphics.vector.Stage doesn't delete objects you create. You must delete them yourself after you finish using them.
Read more at: anychart.graphics.vector.Ellipse

Params:

Name	Type	Description
cx	number	Center X, in pixels.
cy	number	Center Y, in pixels.
rx	number	X radius, in pixels.
ry	number	Y radius, in pixels.

Returns:

anychart.graphics.vector.Ellipse - An instance of the class for method chaining.

Try it:

Usage sample

forEachChild

forEachChild(callback, this)

Applies function to all children.
Similar to anychart.graphics.vector.Layer#forEachChild

Params:

Name	Type	Description
callback	function	Callback.
this	Object	This element.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

getBounds

getBounds()

Returns bounds.

Returns:

anychart.graphics.math.Rect - Bounds.

Try it:

Usage sample

getChildAt

getChildAt(index)

Returns element by index.
Similar to anychart.graphics.vector.Layer#getChildAt

Params:

Name	Type	Description
index	number	Child index.

Returns:

anychart.graphics.vector.Element - Element or null.

getContainerElement

getContainerElement()Since version 7.13.0

Returns stage container element.

Returns:

Element - Stage container element.

Try it:

Usage sample

getDomWrapper

getDomWrapper()Since version 7.13.0

Returns a DIV wrapper that contains stage and other utilitarian DOM elements.

Returns:

Element - The inner wrapper.

Try it:

Usage sample

getJpgBase64String

getJpgBase64String(onSuccess, onError, width, height, quality, forceTransparentWhite)Since version 7.11.0

Returns JPG as base64 string.

Params:

Name	Type	Description
onSuccess	function	Function that is called when sharing is complete.
onError	function	Function that is called if sharing fails.
width	number	Image width.
height	number	Image height.
quality	number	Image quality in ratio 0-1.
forceTransparentWhite	boolean	Force transparent to white or not.

Try it:

Usage sample

getPdfBase64String

getPdfBase64String(onSuccess, onError, paperSizeOrWidth, landscapeOrWidth, x, y)Since version 7.11.0

Returns PDF as base64 string.

Params:

Name	Type	Description
onSuccess	function	Function that is called when sharing is complete.
onError	function	Function that is called if sharing fails.
paperSizeOrWidth	number \| string	Any paper format like 'a0', 'tabloid', 'b4', etc.
landscapeOrWidth	number \| boolean	Define, is landscape.
x	number	Offset X.
y	number	Offset Y.

Try it:

Usage sample

getPngBase64String

getPngBase64String(onSuccess, onError, width, height, quality)Since version 7.11.0

Returns PNG as base64 string.

Params:

Name	Type	Description
onSuccess	function	Function that is called when sharing is complete.
onError	function	Function that is called if sharing fails.
width	number	Image width.
height	number	Image height.
quality	number	Image quality in ratio 0-1.

Try it:

Usage sample

getRotationAngle

getRotationAngle()

Returns rotation angle in degrees.
Read more at: anychart.graphics.vector.Element#getRotationAngle.

Returns:

number - Rotation angle.

getStage

getStage()

Returns self.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

getSvgBase64String

getSvgBase64String(onSuccess, onError, paperSizeOrWidth, landscapeOrHeight)Since version 7.11.0

Returns SVG as base64 string.

Params:

Name	Type	Description
onSuccess	function	Function that is called when sharing is complete.
onError	function	Function that is called if sharing fails.
paperSizeOrWidth	string \| number	Paper Size or width.
landscapeOrHeight	boolean \| string	Landscape or height.

Try it:

Usage sample

getTransformationMatrix

getTransformationMatrix()

Returns current transformation matrix: [ {number} m00 Scale X. {number} m10 Shear Y. {number} m01 Shear X. {number} m11 Scale Y. {number} m02 Translate X. {number} m12 Translate Y. ]
Read more at: anychart.graphics.vector.Element#getTransformationMatrix.

Returns:

Array.<number> - Transformation matrix.

getX

getX()

Returns X of top left corner.

Returns:

number - X of top left corner.

Try it:

Usage sample

getY

getY()

Returns Y of top left corner.

Returns:

number - Y of top left corner.

Try it:

Usage sample

hLine

hLine()

Draws a thick horizontal line set by it circumscribed circle center and radius.
Read more at anychart.graphics.vector.primitives#hLine

Try it:

Usage sample

hasChild

hasChild(element)

Checks if there is such element in children set.
Similar to anychart.graphics.vector.Layer#hasChild

Params:

Name	Type	Description
element	anychart.graphics.vector.Element	Element to check.

Returns:

boolean - Is there such element in stage or not.

hatchFill

hatchFill(type, color, thickness, size)

Invokes anychart.graphics.vector.HatchFill constructor. Note:
anychart.graphics.vector.Stage doesn't delete objects you create. You have to delete them yourself after you finish using them.
Read more at: anychart.graphics.vector.HatchFill

Params:

Name	Type	Description
type	anychart.graphics.vector.HatchFill.HatchFillType	Type of hatch fill.
color	string	Hatch color (You can combine with opacity).
thickness	number	Hatch fill thickness.
size	number	Hatch fill size.

Returns:

anychart.graphics.vector.HatchFill - An instance of the class for method chaining.

Try it:

Usage sample

height

height()

Gets the current stage height.

Returns:

number - The current height of stage.

Try it:

Usage sample

height(value)

Sets a stage height.

Detailed description

If opt_value defined then it will be set as stage height else returns current stage height. Stage height can be defined as pixel or percent value.

Params:

Name	Type	Description
value	string \| number	Height of stage.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

Try it:

Usage sample

html

html(x, y, text, style)

Invokes anychart.graphics.vector.Text and applies anychart.graphics.vector.Text#htmlText method to parse HTML.
Note:
anychart.graphics.vector.Stage doesn't delete objects you create. You must delete them yourself after you finish using them.

Params:

Name	Type	Description
x	number	X-coordinate (Left) of left top corner of text bounds.
y	number	Y-coordinate (Top) of left top corner of text bounds.
text	string	Text.
style	anychart.graphics.vector.TextStyle	Text style. Read more at anychart.graphics.vector.Text#style.

Returns:

anychart.graphics.vector.Text - An instance of the class for method chaining.

Try it:

Usage sample

id

id()

Gets the current stage identifier. If it was not set, than it will be generated.

Returns:

string - Returns element identifier.

Try it:

Usage sample

id(value)

Sets a stage identifier and instantly applies it to DOM.

Params:

Name	Type	Description
value	string	Custom identifier.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

Try it:

Usage sample

image

image(src, x, y, width, height)

Invokes anychart.graphics.vector.Image constructor.
Note:
anychart.graphics.vector.Stage doesn't delete objects you create. You must delete them yourself after you finish using them.

Params:

Name	Type	Description
src	string	IRI (Internationalized Resource Identifiers) for image source.
x	number	X coordinate of left-top corner image.
y	number	Y coordinate of left-top corner image.
width	number	Width of image bounds.
height	number	Height of image bounds.

Returns:

anychart.graphics.vector.Image - Image object instance.

Try it:

Usage sample

indexOfChild

indexOfChild(element)

Returns index of a child.
Similar to anychart.graphics.vector.Layer#indexOfChild

Params:

Name	Type	Description
element	anychart.graphics.vector.Element	Element.

Returns:

number - Index or -1.

isRendering

isRendering()

Indicates if stage is in rendering process.

Returns:

boolean - State of rendering process.

Try it:

Usage sample

isSuspended

isSuspended()

Returns rendering state (true - suspended, false - instant).

Returns:

boolean - Rendering state.

Try it:

Usage sample

layer

layer()

Invokes anychart.graphics.vector.Layer constructor
Note:
anychart.graphics.vector.Stage doesn't delete objects you create. You must delete them yourself after you finish using them.

Returns:

anychart.graphics.vector.Layer - An instance of the class for method chaining.

Try it:

Usage sample

listen

listen(type, listener, useCapture, listenerScope)Since version 7.7.0

Adds an event listener to a stage.

Detailed description

The listener can only be added once and if it is added again the key for the listener is returned.
NoteNote that if the existing listener is a one-off listener (added using listenOnce), it will no longer be a one-off listener after a call to listen() method.

Params:

Name	Type	Default	Description
type	string		The event type id.
listener	function		Callback method.
useCapture	boolean	false	Whether to fire in capture phase. Learn more about capturing https://javascript.info/bubbling-and-capturing
listenerScope	Object		Object in whose scope to call the listener.

Returns:

Object - Unique key for the listener.

Try it:

Usage sample

listenOnce

listenOnce(type, listener, useCapture, listenerScope)Since version 7.7.0

Adds an event listener to a stage

Detailed description

After the event is called, its handler will be deleted.
If the event handler being added already exists, listenOnce will do nothing.
Note In particular, if the handler is already registered using listen(), listenOnce() will not make it one-off. Similarly, if a one-off listener already exists, listenOnce will not change it (it wil remain one-off).

Params:

Name	Type	Default	Description
type	string		The event type id.
listener	function		Callback method.
useCapture	boolean	false	Whether to fire in capture phase. Learn more about capturing https://javascript.info/bubbling-and-capturing
listenerScope	Object		Object in whose scope to call the listener.

Returns:

Object - Unique key for the listener.

Try it:

Usage sample

maxResizeDelay

maxResizeDelay()Since version 7.13.0

Getter for max delay.

Detailed description

Max delay in milliseconds between the container resize and the stage reaction on it.

Returns:

number - Max delay value.

See listing

var delay = stage.maxResizeDelay();

maxResizeDelay(value)Since version 7.13.0

Setter for max delay.

Detailed description

Max delay in milliseconds between the container resize and the stage reaction on it.

Params:

Name	Type	Description
value	number	Max delay value

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

Try it:

Usage sample

numChildren

numChildren()

Number of stage children.
Similar to anychart.graphics.vector.Layer#numChildren

Returns:

number - Number of stage children.

parent

parent()

Returns self.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

path

path()

Invokes anychart.graphics.vector.Path constructor.
Note:
anychart.graphics.vector.Stage doesn't delete objects you create. You must delete them yourself after you finish using them.
Read more at Path: anychart.graphics.vector.Path

Returns:

anychart.graphics.vector.Path - An instance of the class for method chaining.

Try it:

Usage sample

pattern

pattern(bounds)

Invokes anychart.graphics.vector.PatternFill.
Note:
anychart.graphics.vector.Stage doesn't delete objects you create. You must delete them yourself after you finish using them.
Read more at: anychart.graphics.vector.PatternFill

Params:

Name	Type	Description
bounds	anychart.graphics.math.Rect	Bounds of pattern. Defines size and offset of pattern.

Returns:

anychart.graphics.vector.PatternFill - An instance of the class for method chaining.

Try it:

Usage sample

pie

pie()

Draws arc as pie chart element.
Read more at anychart.graphics.vector.primitives#pie

Try it:

Usage sample

print

print(paperSizeOrWidth, landscapeOrHeight)

Print stage.

Params:

Name	Type	Description
paperSizeOrWidth	string \| number	Paper Size or width.
landscapeOrHeight	boolean \| string	Landscape or height.

Try it:

Usage sample

rect

rect(x, y, width, height)

Invokes anychart.graphics.vector.Rect constructor.
Note:
anychart.graphics.vector.Stage doesn't delete objects you create. You must delete them yourself after you finish using them.

Params:

Name	Type	Description
x	number	X (Left) coordinate of top-left corner.
y	number	Y (Top) coordinate of top-left corner.
width	number	Width.
height	number	Height.

Returns:

anychart.graphics.vector.Rect - An instance of the class for method chaining.

Try it:

Usage sample

remove

remove()

Removes everything.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

Try it:

Usage sample

removeAllListeners

removeAllListeners(type)Since version 7.7.0

Removes all listeners from an object. You can also optionally remove listeners of some particular type.

Params:

Name	Type	Description
type	string	Type of event to remove, default is to remove all types.

Returns:

number - Number of listeners removed.

Try it:

Usage sample

removeChild

removeChild(element)

Removes element.
Similar to anychart.graphics.vector.Layer#removeChild

Params:

Name	Type	Description
element	anychart.graphics.vector.Element	Element.

Returns:

anychart.graphics.vector.Element - Removed element.

removeChildAt

removeChildAt(index)

Removes element by index.
Similar to anychart.graphics.vector.Layer#removeChildAt

Params:

Name	Type	Description
index	number	Index.

Returns:

anychart.graphics.vector.Element - Removed element.

removeChildren

removeChildren()

Removes all elements.
Similar to anychart.graphics.vector.Layer#removeChildren

Returns:

Array.<anychart.graphics.vector.Element> - Array of removed elements.

resize

resize(width, height)

Stage resize. Anything drawn on stage must fit in it. So any part that doesn't fit will be clipped.

Params:

Name	Type	Description
width	number \| string	Width.
height	number \| string	Height.

Try it:

Usage sample

resume

resume(force)

Removes suspend state and applies all changes in sync (if any).
Read more at anychart.graphics.vector.Stage#suspend.

Detailed description

This method calculates the count of calls and allows to insert constructions correctly (suspend(); suspend(); resume(); resume() - rendering will happens on the last resume());

Params:

Name	Type	Default	Description
force	boolean	false	If set to true - this parameter resets stack suspends and calls rendering immediately.

Returns:

anychart.graphics.vector.Stage - Stage.

rotate

rotate(degrees, cx, cy)

Rotates root layer.
Read more at: anychart.graphics.vector.Element#rotate.

Params:

Name	Type	Description
degrees	number	Rotation angle.
cx	number	Rotaion X.
cy	number	Rotaion Y.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

rotateByAnchor

rotateByAnchor(degrees, anchor)

Rotates root layer around an anchor.
Read more at: anychart.graphics.vector.Element#rotateByAnchor.

Params:

Name	Type	Description
degrees	number	Rotation angle.
anchor	anychart.graphics.vector.Anchor \| string	Rotation anchor.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

saveAsJpg

saveAsJpg(width, height, quality, forceTransparentWhite, filename)Since version 7.5.1

Saves the current stage as JPG Image.
For export to image JPG use anychart#server.

Params:

Name	Type	Description
width	number	Image width.
height	number	Image height.
quality	number	Image quality in ratio 0-1.
forceTransparentWhite	boolean	Force transparent to white or not.
filename	string	File name to save.

Try it:

Usage sample

saveAsPdf

saveAsPdf(paperSize, landscape, x, y, filename)Since version 7.5.1

Saves the current stage as PDF Document.
For export to PDF file use anychart#server.

Params:

Name	Type	Description
paperSize	string	Any paper format like "a0", "tabloid", "b4", etc.
landscape	boolean	Define, is landscape.
x	number	Offset X.
y	number	Offset Y.
filename	string	File name to save.

Try it:

Usage sample

saveAsPng

saveAsPng(width, height, quality, filename)Since version 7.5.1

Saves the current stage as PNG Image.
For export to image PNG use anychart#server.

Params:

Name	Type	Description
width	number	Image width.
height	number	Image height.
quality	number	Image quality in ratio 0-1.
filename	string	File name to save.

Try it:

Usage sample

saveAsSvg

saveAsSvg(paperSize, landscape, filename)Since version 7.5.1

Saves the stage as SVG Image.
For export to SVG use anychart#server.

Params:

Name	Type	Description
paperSize	string	Paper Size.
landscape	boolean	Landscape.
filename	string	File name to save.

Try it:

Usage sample

saveAsSvg(width, height)Since version 7.5.1

Saves the stage as SVG Image using width and height.
For export to SVG use anychart#server.

Params:

Name	Type	Description
width	number	Image width.
height	number	Image height.

Try it:

Usage sample

scale

scale(sx, sy, cx, cy)

Scales root layer in parent coordinates system. Scaling center is set in the parent system too.
Read more at: anychart.graphics.vector.Element#scale.

Params:

Name	Type	Description
sx	number	Scale X.
sy	number	Scale Y.
cx	number	Scale center X.
cy	number	Scale center Y.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

scaleByAnchor

scaleByAnchor(sx, sy, anchor)

Scales root layer in parent coordinates system. Scaling center is set by root layer anchor.
Read more at: anychart.graphics.vector.Element#scaleByAnchor.

Params:

Name	Type	Description
sx	number	Scale X.
sy	number	Scale Y.
anchor	anychart.graphics.vector.Anchor \| string	Scaling center anchor.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

setPosition

setPosition(x, y)

Sets top left corner coordinates of root layer (with transformation,in parent coordinate system).
Read more at: anychart.graphics.vector.Element#setPosition.

Params:

Name	Type	Description
x	number	X of top left corner.
y	number	Y of top left corner.

Returns:

anychart.graphics.vector.Stage - Returns self for chaining.

setRotation

setRotation(degrees, cx, cy)

Rotates root layer around a point.
Read more at: anychart.graphics.vector.Element#setRotation.

Params:

Name	Type	Description
degrees	number	Rotation angle.
cx	number	Rotaion X.
cy	number	Rotaion Y.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

setRotationByAnchor

setRotationByAnchor(degrees, anchor)

Rotates root layer around an anchor.
Read more at: anychart.graphics.vector.Element#setRotationByAnchor.

Params:

Name	Type	Description
degrees	number	Rotation angle.
anchor	anychart.graphics.vector.Anchor \| string	Rotation anchor.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

setTransformationMatrix

setTransformationMatrix(m00, m10, m01, m11, m02, m12)

Sets transformation matrix.
Read more at: anychart.graphics.vector.Element#setTransformationMatrix.

Params:

Name	Type	Description
m00	number	Scale X.
m10	number	Shear Y.
m01	number	Shear X.
m11	number	Scale Y.
m02	number	Translate X.
m12	number	Translate Y.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

shareAsJpg

shareAsJpg(onSuccess, onError, asBase64, width, height, quality, forceTransparentWhite, filename)Since version 7.11.0

Share a stage as a JPG and return link to shared image.

Params:

Name	Type	Description
onSuccess	function	Function that is called when sharing is complete.
onError	function	Function that is called if sharing fails.
asBase64	boolean	Share as base64 file.
width	number	Image width.
height	number	Image height.
quality	number	Image quality in ratio 0-1.
forceTransparentWhite	boolean	Force transparent to white or not.
filename	string	File name to save.

Try it:

Usage sample

shareAsPdf

shareAsPdf(onSuccess, onError, asBase64, paperSizeOrWidth, landscapeOrWidth, x, y, filename)Since version 7.11.0

Share a stage as a PDF and return link to shared image.

Params:

Name	Type	Description
onSuccess	function	Function that is called when sharing is complete.
onError	function	Function that is called if sharing fails.
asBase64	boolean	Share as base64 file.
paperSizeOrWidth	number \| string	Any paper format like 'a0', 'tabloid', 'b4', etc.
landscapeOrWidth	number \| boolean	Define, is landscape.
x	number	Offset X.
y	number	Offset Y.
filename	string	File name to save.

Try it:

Usage sample

shareAsPng

shareAsPng(onSuccess, onError, asBase64, width, height, quality, filename)Since version 7.11.0

Shares a stage as a PNG file and returns a link to the shared image.

Params:

Name	Type	Description
onSuccess	function	Function that is called when sharing is complete.
onError	function	Function that is called if sharing fails.
asBase64	boolean	Share as base64 file.
width	number	Image width.
height	number	Image height.
quality	number	Image quality in ratio 0-1.
filename	string	File name to save.

Try it:

Usage sample

shareAsSvg

shareAsSvg(onSuccess, onError, asBase64, paperSizeOrWidth, landscapeOrHeight, filename)Since version 7.11.0

Share a stage as a SVG and return link to shared image.

Params:

Name	Type	Description
onSuccess	function	Function that is called when sharing is complete.
onError	function	Function that is called if sharing fails.
asBase64	boolean	Share as base64 file.
paperSizeOrWidth	string \| number	Paper Size or width.
landscapeOrHeight	boolean \| string	Landscape or height.
filename	string	File name to save.

Try it:

Usage sample

star

star()

Draws multi-pointed star.
Read more at anychart.graphics.vector.primitives#star

Try it:

Usage sample

star10

star10()

Draws ten-pointed star.
Read more at anychart.graphics.vector.primitives#star10

Try it:

Usage sample

star4

star4()

Draws four-pointed star.
Read more at anychart.graphics.vector.primitives#star4

Try it:

Usage sample

star5

star5()

Draws five-pointed star.
Read more at anychart.graphics.vector.primitives#star5

Try it:

Usage sample

star6

star6()

Draws six-pointed star.
Read more at anychart.graphics.vector.primitives#star6

Try it:

Usage sample

star7

star7()

Draws seven-pointed star.
Read more at anychart.graphics.vector.primitives#star7

Try it:

Usage sample

suspend

suspend()

Suspends rendering (changes instant to suspended).

Detailed description

When Stage is in this state changes do not affect DOM.
To wake Stage up from this state you need to invoke anychart.graphics.vector.Stage#resume.
Suspended rendering is much faster than instant when there are a lot of operations with a Stage.
This method calculates the count of calls and allows to insert constructions correctly (suspend(); suspend(); resume(); resume() - rendering will happen on the last resume()).

Returns:

anychart.graphics.vector.Stage - Stage.

Try it:

Usage sample

swapChildren

swapChildren(element1, element2)

Swaps two children.
Similar to anychart.graphics.vector.Layer#swapChildren

Params:

Name	Type	Description
element1	anychart.graphics.vector.Element	First child.
element2	anychart.graphics.vector.Element	Second child.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

swapChildrenAt

swapChildrenAt(index1, index2)

Swaps two children by id.
Similar to anychart.graphics.vector.Layer#swapChildrenAt

Params:

Name	Type	Description
index1	number	First child or id.
index2	number	Second child or id.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

text

text(x, y, text, style)

Invokes anychart.graphics.vector.Text constructor.
Note:
anychart.graphics.vector.Stage doesn't delete objects you create. You must delete them yourself after you finish using them.

Params:

Name	Type	Description
x	number	X-coordinate (Left) of left top corner of text bounds.
y	number	Y-coordinate (Top) of left top corner of text bounds.
text	string	Text.
style	anychart.graphics.vector.TextStyle	Text style. Read more at anychart.graphics.vector.Text#style.

Returns:

anychart.graphics.vector.Text - An instance of the class for method chaining.

Try it:

title

title()Since version 7.11.0

Getter for the element title value.

Returns:

string | null | undefined - The element title value.

Try it:

Usage sample

title(value)Since version 7.11.0

Setter for the element title value.

Params:

Name	Type	Description
value	string \| null	Value to set.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

Try it:

Usage sample

toSvg

toSvg(paperSize, landscape)Since version 7.5.1

Returns SVG string if type of content is SVG with parameters otherwise returns empty string.

Params:

Name	Type	Description
paperSize	string	Paper Size.
landscape	boolean	Landscape.

Returns:

string - SVG content or empty string.

Try it:

Usage sample

toSvg(width, height)Since version 7.5.1

Returns SVG string if type of content is SVG with determined the width and height otherwise returns empty string.

Params:

Name	Type	Description
width	number	Image width.
height	number	Image height.

Returns:

string - SVG content or empty string.

Try it:

Usage sample

translate

translate(tx, ty)

Moves root layer taking transformation into account.
Movement happens in root layer coordinates.
Read more at: anychart.graphics.vector.Element#translate.

Params:

Name	Type	Description
tx	number	X offset.
ty	number	Y offset.

Returns:

anychart.graphics.vector.Stage - Self instance for method chaining.

triangleDown

triangleDown()

Draws a triangle heading downwards set by it circumscribed circle center and radius.
Read more at anychart.graphics.vector.primitives#triangleDown

Try it:

Usage sample

triangleLeft

triangleLeft()

Draws a triangle heading leftwards set by it circumscribed circle center and radius.
Read more at anychart.graphics.vector.primitives#triangleLeft

Try it:

Usage sample

triangleRight

triangleRight()

Draws a triangle heading rightwards set by it circumscribed circle center and radius.
Read more at anychart.graphics.vector.primitives#triangleRight

Try it:

Usage sample

triangleUp

triangleUp()

Draws a triangle heading upwards set by its circumscribed circle center and radius.
Read more at anychart.graphics.vector.primitives#triangleUp

Try it:

Usage sample

unlisten

unlisten(type, listener, useCapture, listenerScope)Since version 7.7.0

Removes a listener added with listen() or listenOnce() methods.

Params:

Name	Type	Default	Description
type	string		The event type id.
listener	function		Callback method.
useCapture	boolean	false	Whether to fire in capture phase. Learn more about capturing https://javascript.info/bubbling-and-capturing
listenerScope	Object		Object in whose scope to call the listener.