Class: xrx.drawing.Drawing

xrx.drawing. Drawing

new xrx.drawing.Drawing(element, opt_engine)

A class representing a drawing canvas. The drawing canvas can have a background image and thereby can serve as an image annotation tool.
Parameters:
Name Type Description
element DOMElement The HTML element used to install the canvas.
opt_engine xrx.engine.Canvas | xrx.engine.SVG | xrx.engine.VML The rendering engine type.
Source:

Members

(private) xrx.drawing.Drawing#canvas_ :xrx.shape.Canvas

The graphics canvas.
Type:
Source:

(private) xrx.drawing.Drawing#creatable_ :Object

The shape currently created by the user.
Type:
  • Object
Source:

(private) xrx.drawing.Drawing#element_ :DOMElement

The DOM element used to install the drawing canvas.
Type:
  • DOMElement
Source:

(private) xrx.drawing.Drawing#engine_ :xrx.engine.Engine

The graphics rendering engine.
Type:
Source:

(private) xrx.drawing.Drawing#eventBeforeRendering

Just for debugging.
Source:

(private) xrx.drawing.Drawing#height_ :number

The height of this drawing canvas.
Type:
  • number
Source:

(private) xrx.drawing.Drawing#hoverable_ :xrx.drawing.Hoverable

The shape currently hovered by the user.
Type:
Source:

(private) xrx.drawing.Drawing#layer_ :Array

The layers of the drawing canvas.
Type:
  • Array
Source:

(private) xrx.drawing.Drawing#mode_ :number

Type:
  • number
Source:

(private) xrx.drawing.Drawing#modifiable_ :xrx.drawing.Modifiable

The shape currently modified by the user.
Type:
Source:

(private) xrx.drawing.Drawing#selectable_ :xrx.drawing.Selectable

The shape currently selected by the user.
Type:
Source:

(private) xrx.drawing.Drawing#shield_ :xrx.shape.Rect

A shield in front of the canvas needed by the SVG and the VML rendering engine for smooth dragging of elements.
Type:
Source:

(private) xrx.drawing.Drawing#timeoutDraw_ :function

Timeout function for function draw() to improve performance.
Type:
  • function
Source:

(private) xrx.drawing.Drawing#timeoutResize_ :function

Timeout function for function handleResize() to improve performance.
Type:
  • function
Source:

(private) xrx.drawing.Drawing#viewbox_ :xrx.viewbox.Viewbox

The view-box of the drawing canvas.
Type:
Source:

(private) xrx.drawing.Drawing#vsm_ :goog.dom.VieportSizeMonitor

Viewport size monitor. Fires events whenever the size of the browser window changes.
Type:
  • goog.dom.VieportSizeMonitor
Source:

(private) xrx.drawing.Drawing#width_ :number

The width of this drawing canvas.
Type:
  • number
Source:

Methods

xrx.drawing.Drawing#addShapes(var_args)

Adds one or more shapes to this drawing canvas.
Parameters:
Name Type Description
var_args xrx.shape.Shape The shapes.
Source:

(private) xrx.drawing.Drawing#calculateSize_()

Source:

xrx.drawing.Drawing#draw()

Draws this canvas and all its layers, tools and shapes contained.
Source:

xrx.drawing.Drawing#getBackgroundImage() → {HTMLImage}

Returns the current background image of this drawing canvas.
Source:
Returns:
The background image.
Type
HTMLImage

xrx.drawing.Drawing#getCanvas() → {xrx.shape.Canvas}

Returns the canvas object of this drawing canvas.
Source:
Returns:
The canvas object.
Type
xrx.shape.Canvas

xrx.drawing.Drawing#getElement() → {DOMElement}

Returns the wrapper element of this drawing canvas.
Source:
Returns:
The wrapper.
Type
DOMElement

xrx.drawing.Drawing#getEngine() → {xrx.engine.Engine}

Returns the engine used for rendering.
Source:
Returns:
The engine.
Type
xrx.engine.Engine

xrx.drawing.Drawing#getHeight(height)

Returns the height of this drawing canvas.
Parameters:
Name Type Description
height number The height in pixel.
Source:

xrx.drawing.Drawing#getLayerBackground() → {xrx.drawing.LayerBackground}

Returns the background layer of this drawing canvas.
Source:
Returns:
The background layer object.
Type
xrx.drawing.LayerBackground

xrx.drawing.Drawing#getLayerShape() → {xrx.drawing.LayerShape}

Returns the shape layer of this drawing canvas.
Source:
Returns:
The shape layer object.
Type
xrx.drawing.LayerShape

xrx.drawing.Drawing#getLayerShapeCreate() → {xrx.drawing.LayerShapeCreate}

Returns the layer where new shapes can be drawn.
Source:
Returns:
The create layer object.
Type
xrx.drawing.LayerShapeCreate

xrx.drawing.Drawing#getLayerShapeModify() → {xrx.drawing.LayerShapeModify}

Returns the layer where shapes can be modified.
Source:
Returns:
The shape modify layer object.
Type
xrx.drawing.LayerShapeModify

xrx.drawing.Drawing#getLayerTool() → {xrx.drawing.LayerTool}

Returns the layer where tools can be plugged in.
Source:
Returns:
The tool layer object.
Type
xrx.drawing.LayerTool

xrx.drawing.Drawing#getMode() → {number}

Returns the current mode of this drawing canvas.
Source:
Returns:
The mode.
Type
number

xrx.drawing.Drawing#getShapes() → {Array.<xrx.shape.Shape>}

Returns the shapes currently rendered by this drawing canvas.
Source:
Returns:
The shapes.
Type
Array.<xrx.shape.Shape>

xrx.drawing.Drawing#getViewbox() → {Object}

Returns the view-box of this drawing canvas.
Source:
Returns:
The view-box.
Type
Object

xrx.drawing.Drawing#getWidth(width)

Returns the width of this drawing canvas.
Parameters:
Name Type Description
width number The width in pixel.
Source:

xrx.drawing.Drawing#handleResize()

Handles resizing of this drawing canvas. This function is automatically called whenever the size of the browser window changes. It can be also called by an application that manually changes the size of this drawing canvas during live time.
Source:

(private) xrx.drawing.Drawing#initEngine_()

Source:

(private) xrx.drawing.Drawing#install_()

Source:

(private) xrx.drawing.Drawing#installCanvas_()

Source:

(private) xrx.drawing.Drawing#installLayerBackground_()

Source:

(private) xrx.drawing.Drawing#installLayerShape_()

Source:

(private) xrx.drawing.Drawing#installLayerShapecreatable_()

Source:

(private) xrx.drawing.Drawing#installLayerShapeModify_()

Source:

(private) xrx.drawing.Drawing#installLayerTool_()

Source:

(private) xrx.drawing.Drawing#installShield_()

Source:

(private) xrx.drawing.Drawing#installViewbox_()

Source:

xrx.drawing.Drawing#setBackgroundImage(url, opt_callback)

Sets a background image to this drawing canvas.
Parameters:
Name Type Description
url string The URL of the image.
opt_callback function A callback function that is evaluated after the image is loaded.
Source:

xrx.drawing.Drawing#setHeight(height)

Sets the height of this drawing canvas.
Parameters:
Name Type Description
height number The height in pixel.
Source:

(private) xrx.drawing.Drawing#setMode_()

Source:

xrx.drawing.Drawing#setModeCreate(creatable)

Switch the drawing canvas over into mode create to allow drawing of new shapes.
Parameters:
Name Type Description
creatable xrx.shape.Creatable The shape to be created.
Source:
See:

xrx.drawing.Drawing#setModeDisabled()

Switch the drawing canvas over into mode disabled.
Source:

xrx.drawing.Drawing#setModeHover(opt_overlapping)

Switch the drawing canvas over into mode hover to allow hovering of shapes.
Parameters:
Name Type Description
opt_overlapping boolean Whether to highlight all hovered shapes that lie on top of each other or just the most forward. opt_overlapping defaults to false.
Source:

xrx.drawing.Drawing#setModeModify()

Switch the drawing canvas over into mode modify to allow modification of shapes.
Source:
See:

xrx.drawing.Drawing#setModeSelect()

Switch the drawing canvas over into mode select to allow selecting of shapes.
Source:

xrx.drawing.Drawing#setModeView()

Switch the drawing canvas over into mode view to allow view-box panning zooming and rotating.
Source:

xrx.drawing.Drawing#setSelected(shape)

Sets a shape as the selected.
Parameters:
Name Type Description
shape xrx.shape.Shape The shape to be selected.
Source:

xrx.drawing.Drawing#setSize(width, height)

Sets the size of this drawing canvas.
Parameters:
Name Type Description
width number The width in pixel.
height number The height in pixel.
Source:

xrx.drawing.Drawing#setStyle(The, The)

Sets a CSS style for this drawing canvas.
Parameters:
Name Type Description
The string style name such as 'padding'.
The string style value such as '20px'.
Source:

xrx.drawing.Drawing#setWidth(width)

Sets the width of this drawing canvas.
Parameters:
Name Type Description
width number The width in pixel.
Source:

Events

xrx.drawing.Drawing#event:eventShapeModify

Event that is thrown whenever a shape is modified.
Parameters:
Name Type Description
shape xrx.shape.Shape The shape that was modified.
Source: