scaleTo()

Scale the object to the specified size.

Description

Scale the object to the specified size. If the object is a radial object, width and height will be interpreted as a radius.

Note: oCanvas does not currently handle events correctly on objects that have been scaled.

Arguments

width : Number

The new width of the object. New horizontal radius, if it is a radial object.

height : Number

The new height of the object. New vertical radius, if it is a radial object.

Return Value

displayObject. Returns the display object itself.

Examples

Example 1

We create a new core instance and a rectangle that we add to the canvas. Then we add an event handler that scales the rectangle when clicked.

var canvas = oCanvas.create({
	canvas: "#canvas",
	background: "#ccc"
});

var rectangle = canvas.display.rectangle({
	x: 177,
	y: 170,
	origin: { x: "center", y: "center" },
	width: 200,
	height: 100,
	fill: "#000"
});

canvas.addChild(rectangle);

rectangle.bind("click tap", function () {
	this.scaleTo(100, 20);
	canvas.redraw();
});

Example 2

We create a new core instance and a circle that we add to the canvas. Then we add an event handler that scales the circle when clicked, which will make it look like an ellipse.

var canvas = oCanvas.create({
	canvas: "#canvas",
	background: "#ccc"
});

var circle = canvas.display.ellipse({
	x: 177,
	y: 170,
	radius: 100,
	fill: "#000"
});

canvas.addChild(circle);

circle.bind("click tap", function () {
	this.scaleTo(50, 20);
	canvas.redraw();
});