lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-06-28 15:23:44 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

updated docs

Browse Source
This commit is contained in:
Eric Rowell 2012-07-22 23:30:56 -07:00
parent f7e233100a
commit 3617d8ef5f
4 changed files with 193 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

116
dist/kinetic-core.js vendored
View File

@ -748,7 +748,8 @@ Kinetic.Node = Kinetic.Class.extend({
return this.attrs; return this.attrs;
}, },
/** /**
* set default attrs * set default attrs. This method should only be used if
* you're creating a custom node
* @name setDefaultAttrs * @name setDefaultAttrs
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Object} confic * @param {Object} confic
@ -877,7 +878,7 @@ Kinetic.Node = Kinetic.Class.extend({
}, },
/** /**
* determine if shape is visible or not. Shape is visible only * determine if shape is visible or not. Shape is visible only
* if it's visible and all of its ancestors are visible. If one ancestor * if it's visible and all of its ancestors are visible. If an ancestor
* is invisible, this means that the shape is also invisible * is invisible, this means that the shape is also invisible
* @name isVisible * @name isVisible
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
@ -899,7 +900,7 @@ Kinetic.Node = Kinetic.Class.extend({
}); });
}, },
/** /**
* hide node * hide node. Hidden nodes are no longer detectable
* @name hide * @name hide
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -917,8 +918,8 @@ Kinetic.Node = Kinetic.Class.extend({
return this.index; return this.index;
}, },
/** /**
* get absolute z-index by taking into account * get absolute z-index which takes into account sibling
* all parent and sibling indices * and parent indices
* @name getAbsoluteZIndex * @name getAbsoluteZIndex
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -970,7 +971,8 @@ Kinetic.Node = Kinetic.Class.extend({
* set node position * set node position
* @name setPosition * @name setPosition
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Object} point * @param {Number} x
* @param {Number} y
*/ */
setPosition: function() { setPosition: function() {
var pos = Kinetic.Type._getXY(Array.prototype.slice.call(arguments)); var pos = Kinetic.Type._getXY(Array.prototype.slice.call(arguments));
@ -988,7 +990,7 @@ Kinetic.Node = Kinetic.Class.extend({
}; };
}, },
/** /**
* get absolute position relative to stage * get absolute position
* @name getAbsolutePosition * @name getAbsolutePosition
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -999,7 +1001,7 @@ Kinetic.Node = Kinetic.Class.extend({
return trans.getTranslation(); return trans.getTranslation();
}, },
/** /**
* set absolute position relative to stage * set absolute position
* @name setAbsolutePosition * @name setAbsolutePosition
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Object} pos object containing an x and * @param {Object} pos object containing an x and
@ -1031,6 +1033,8 @@ Kinetic.Node = Kinetic.Class.extend({
* move node by an amount * move node by an amount
* @name move * @name move
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Number} x
* @param {Number} y
*/ */
move: function() { move: function() {
var pos = Kinetic.Type._getXY(Array.prototype.slice.call(arguments)); var pos = Kinetic.Type._getXY(Array.prototype.slice.call(arguments));
@ -1082,7 +1086,7 @@ Kinetic.Node = Kinetic.Class.extend({
}); });
}, },
/** /**
* move node to top * move node to the top of its siblings
* @name moveToTop * @name moveToTop
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -1117,7 +1121,7 @@ Kinetic.Node = Kinetic.Class.extend({
} }
}, },
/** /**
* move node to bottom * move node to the bottom of its siblings
* @name moveToBottom * @name moveToBottom
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -1131,7 +1135,7 @@ Kinetic.Node = Kinetic.Class.extend({
* set zIndex * set zIndex
* @name setZIndex * @name setZIndex
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {int} zIndex * @param {Integer} zIndex
*/ */
setZIndex: function(zIndex) { setZIndex: function(zIndex) {
var index = this.index; var index = this.index;
@ -1234,7 +1238,7 @@ Kinetic.Node = Kinetic.Class.extend({
* @name transitionTo * @name transitionTo
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Object} config * @param {Object} config
* @config {Number} [duration] duration that the transition runs in seconds * @config {Number} duration duration that the transition runs in seconds
* @config {String} [easing] easing function. can be linear, ease-in, ease-out, ease-in-out, * @config {String} [easing] easing function. can be linear, ease-in, ease-out, ease-in-out,
* back-ease-in, back-ease-out, back-ease-in-out, elastic-ease-in, elastic-ease-out, * back-ease-in, back-ease-out, back-ease-in-out, elastic-ease-in, elastic-ease-out,
* elastic-ease-in-out, bounce-ease-out, bounce-ease-in, bounce-ease-in-out, * elastic-ease-in-out, bounce-ease-out, bounce-ease-in, bounce-ease-in-out,
@ -1298,8 +1302,8 @@ Kinetic.Node = Kinetic.Class.extend({
return trans; return trans;
}, },
/** /**
* get transform of the node while taking into * get absolute transform of the node which takes into
* account the transforms of its parents * account its parent transforms
* @name getAbsoluteTransform * @name getAbsoluteTransform
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -1325,8 +1329,7 @@ Kinetic.Node = Kinetic.Class.extend({
return am; return am;
}, },
/** /**
* get transform of the node while not taking * get transform of the node
* into account the transforms of its parents
* @name getTransform * @name getTransform
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -1352,8 +1355,7 @@ Kinetic.Node = Kinetic.Class.extend({
* clone node * clone node
* @name clone * @name clone
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Object} config used to override cloned * @param {Object} attrs override attrs
* attrs
*/ */
clone: function(obj) { clone: function(obj) {
// instantiate new node // instantiate new node
@ -1434,6 +1436,13 @@ Kinetic.Node = Kinetic.Class.extend({
* @name toDataURL * @name toDataURL
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Object} config * @param {Object} config
* @param {String} [config.mimeType] mime type. can be "image/png" or "image/jpeg".
* "image/png" is the default
* @param {Number} [config.width] data url image width
* @param {Number} [config.height] data url image height
* @param {Number} [config.quality] jpeg quality. If using an "image/jpeg" mimeType,
* you can specify the quality from 0 to 1, where 0 is very poor quality and 1
* is very high quality
*/ */
toDataURL: function(config) { toDataURL: function(config) {
var mimeType = config && config.mimeType ? config.mimeType : null; var mimeType = config && config.mimeType ? config.mimeType : null;
@ -1457,6 +1466,15 @@ Kinetic.Node = Kinetic.Class.extend({
* @name toImage * @name toImage
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
* @param {Object} config * @param {Object} config
* @param {Function} callback since the toImage() method is asynchonrous, the
* resulting image object is passed into the callback function
* @param {String} [config.mimeType] mime type. can be "image/png" or "image/jpeg".
* "image/png" is the default
* @param {Number} [config.width] data url image width
* @param {Number} [config.height] data url image height
* @param {Number} [config.quality] jpeg quality. If using an "image/jpeg" mimeType,
* you can specify the quality from 0 to 1, where 0 is very poor quality and 1
* is very high quality
*/ */
toImage: function(config) { toImage: function(config) {
Kinetic.Type._getImage(this.toDataURL(config), function(img) { Kinetic.Type._getImage(this.toDataURL(config), function(img) {
@ -1678,7 +1696,7 @@ Kinetic.Node.addSetters(Kinetic.Node, ['rotationDeg']);
* set detection type * set detection type
* @name setDetectionType * @name setDetectionType
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {String} type can be "path" or "pixel" * @param {String} type can be path or pixel
*/ */
/** /**
@ -1705,14 +1723,14 @@ Kinetic.Node.addSetters(Kinetic.Node, ['rotationDeg']);
*/ */
/** /**
* set drag constraint * set drag constraint.
* @name setDragConstraint * @name setDragConstraint
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {String} constraint * @param {String} constraint can be vertical, horizontal, or none
*/ */
/** /**
* set drag bounds * set drag bounds.
* @name setDragBounds * @name setDragBounds
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Object} bounds * @param {Object} bounds
@ -1738,7 +1756,7 @@ Kinetic.Node.addSetters(Kinetic.Node, ['rotationDeg']);
/** /**
* set offset * set offset
* @name setOffset * @name setOffset a node's offset defines the positition and rotation point
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Number} x * @param {Number} x
* @param {Number} y * @param {Number} y
@ -1747,7 +1765,8 @@ Kinetic.Node.addSetters(Kinetic.Node, ['rotationDeg']);
/** /**
* set node scale. * set node scale.
* @name setScale * @name setScale
* @param {Number|Array|Object|List} scale * @param {Number} x
* @param {Number} y
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -1770,7 +1789,7 @@ Kinetic.Node.addSetters(Kinetic.Node, ['rotationDeg']);
*/ */
/** /**
* get detection type * get detection type. Can be path or pixel
* @name getDetectionType * @name getDetectionType
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -1782,9 +1801,7 @@ Kinetic.Node.addSetters(Kinetic.Node, ['rotationDeg']);
*/ */
/** /**
* get alpha. Alpha values range from 0 to 1. * get alpha.
* A node with an alpha of 0 is fully transparent, and a node
* with an alpha of 1 is fully opaque
* @name getAlpha * @name getAlpha
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -2162,6 +2179,8 @@ Kinetic.Stage = Kinetic.Container.extend({
* set stage size * set stage size
* @name setSize * @name setSize
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
* @param {Number} width
* @param {Number} height
*/ */
setSize: function() { setSize: function() {
// set stage dimensions // set stage dimensions
@ -2169,7 +2188,7 @@ Kinetic.Stage = Kinetic.Container.extend({
this.setAttrs(size); this.setAttrs(size);
}, },
/** /**
* return stage size * get stage size
* @name getSize * @name getSize
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
*/ */
@ -2191,7 +2210,8 @@ Kinetic.Stage = Kinetic.Container.extend({
} }
}, },
/** /**
* serialize stage and children as a JSON object * serialize stage and children as a JSON object and return
* the result as a json string
* @name toJSON * @name toJSON
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
*/ */
@ -2354,6 +2374,15 @@ Kinetic.Stage = Kinetic.Container.extend({
* @name toDataURL * @name toDataURL
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
* @param {Object} config * @param {Object} config
* @param {Function} callback since the stage toDataURL() method is asynchronous,
* the data url string will be passed into the callback
* @param {String} [config.mimeType] mime type. can be "image/png" or "image/jpeg".
* "image/png" is the default
* @param {Number} [config.width] data url image width
* @param {Number} [config.height] data url image height
* @param {Number} [config.quality] jpeg quality. If using an "image/jpeg" mimeType,
* you can specify the quality from 0 to 1, where 0 is very poor quality and 1
* is very high quality
*/ */
toDataURL: function(config) { toDataURL: function(config) {
var mimeType = config && config.mimeType ? config.mimeType : null; var mimeType = config && config.mimeType ? config.mimeType : null;
@ -2393,6 +2422,15 @@ Kinetic.Stage = Kinetic.Container.extend({
* @name toImage * @name toImage
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
* @param {Object} config * @param {Object} config
* @param {Function} callback since the toImage() method is asynchonrous, the
* resulting image object is passed into the callback function
* @param {String} [config.mimeType] mime type. can be "image/png" or "image/jpeg".
* "image/png" is the default
* @param {Number} [config.width] data url image width
* @param {Number} [config.height] data url image height
* @param {Number} [config.quality] jpeg quality. If using an "image/jpeg" mimeType,
* you can specify the quality from 0 to 1, where 0 is very poor quality and 1
* is very high quality
*/ */
toImage: function(config) { toImage: function(config) {
this.toDataURL({ this.toDataURL({
@ -3038,7 +3076,7 @@ Kinetic.Node.addGettersSetters(Kinetic.Stage, ['width', 'height', 'throttle']);
*/ */
/** /**
* get throttle * get event throttle for event detections per second.
* @name getThrottle * @name getThrottle
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
*/ */
@ -3058,13 +3096,16 @@ Kinetic.Node.addGettersSetters(Kinetic.Stage, ['width', 'height', 'throttle']);
*/ */
/** /**
* set throttle. Increasing the throttle will increase * set throttle for event detections per second. Increasing the throttle will increase
* the number of mousemove and touchmove event detections, * the number of mousemove and touchmove event detections,
* and decreasing the throttle will decrease the number * and decreasing the throttle will decrease the number
* of mousemove and touchmove events which improves performance * of mousemove and touchmove events which improves performance. The event
* throttling is defaulted to 80 event detections per second
* @name setThrottle * @name setThrottle
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
* @param {Number} throttle * @param {Number} throttle
* @example
* <a href="http://www.html5canvastutorials.com/kineticjs/html5-canvas-load-stage-with-json-string-with-kineticjs/">simple load example</a>
*/ */
/////////////////////////////////////////////////////////////////////// ///////////////////////////////////////////////////////////////////////
// Layer // Layer
@ -3179,6 +3220,13 @@ Kinetic.Layer = Kinetic.Container.extend({
* @name toDataURL * @name toDataURL
* @methodOf Kinetic.Layer.prototype * @methodOf Kinetic.Layer.prototype
* @param {Object} config * @param {Object} config
* @param {String} [config.mimeType] mime type. can be "image/png" or "image/jpeg".
* "image/png" is the default
* @param {Number} [config.width] data url image width
* @param {Number} [config.height] data url image height
* @param {Number} [config.quality] jpeg quality. If using an "image/jpeg" mimeType,
* you can specify the quality from 0 to 1, where 0 is very poor quality and 1
* is very high quality
*/ */
toDataURL: function(config) { toDataURL: function(config) {
var canvas; var canvas;
@ -3692,7 +3740,7 @@ Kinetic.Node.addGettersSetters(Kinetic.Shape, ['fill', 'stroke', 'lineJoin', 'st
/** /**
* get stroke color * get stroke color
* @name getStrokeColor * @name getStroke
* @methodOf Kinetic.Shape.prototype * @methodOf Kinetic.Shape.prototype
*/ */

7
src/Layer.js
View File

@ -111,6 +111,13 @@ Kinetic.Layer = Kinetic.Container.extend({
* @name toDataURL * @name toDataURL
* @methodOf Kinetic.Layer.prototype * @methodOf Kinetic.Layer.prototype
* @param {Object} config * @param {Object} config
* @param {String} [config.mimeType] mime type. can be "image/png" or "image/jpeg".
* "image/png" is the default
* @param {Number} [config.width] data url image width
* @param {Number} [config.height] data url image height
* @param {Number} [config.quality] jpeg quality. If using an "image/jpeg" mimeType,
* you can specify the quality from 0 to 1, where 0 is very poor quality and 1
* is very high quality
*/ */
toDataURL: function(config) { toDataURL: function(config) {
var canvas; var canvas;

73
src/Node.js
View File

@ -141,7 +141,8 @@ Kinetic.Node = Kinetic.Class.extend({
return this.attrs; return this.attrs;
}, },
/** /**
* set default attrs * set default attrs. This method should only be used if
* you're creating a custom node
* @name setDefaultAttrs * @name setDefaultAttrs
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Object} confic * @param {Object} confic
@ -270,7 +271,7 @@ Kinetic.Node = Kinetic.Class.extend({
}, },
/** /**
* determine if shape is visible or not. Shape is visible only * determine if shape is visible or not. Shape is visible only
* if it's visible and all of its ancestors are visible. If one ancestor * if it's visible and all of its ancestors are visible. If an ancestor
* is invisible, this means that the shape is also invisible * is invisible, this means that the shape is also invisible
* @name isVisible * @name isVisible
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
@ -292,7 +293,7 @@ Kinetic.Node = Kinetic.Class.extend({
}); });
}, },
/** /**
* hide node * hide node. Hidden nodes are no longer detectable
* @name hide * @name hide
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -310,8 +311,8 @@ Kinetic.Node = Kinetic.Class.extend({
return this.index; return this.index;
}, },
/** /**
* get absolute z-index by taking into account * get absolute z-index which takes into account sibling
* all parent and sibling indices * and parent indices
* @name getAbsoluteZIndex * @name getAbsoluteZIndex
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -363,7 +364,8 @@ Kinetic.Node = Kinetic.Class.extend({
* set node position * set node position
* @name setPosition * @name setPosition
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Object} point * @param {Number} x
* @param {Number} y
*/ */
setPosition: function() { setPosition: function() {
var pos = Kinetic.Type._getXY(Array.prototype.slice.call(arguments)); var pos = Kinetic.Type._getXY(Array.prototype.slice.call(arguments));
@ -381,7 +383,7 @@ Kinetic.Node = Kinetic.Class.extend({
}; };
}, },
/** /**
* get absolute position relative to stage * get absolute position
* @name getAbsolutePosition * @name getAbsolutePosition
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -392,7 +394,7 @@ Kinetic.Node = Kinetic.Class.extend({
return trans.getTranslation(); return trans.getTranslation();
}, },
/** /**
* set absolute position relative to stage * set absolute position
* @name setAbsolutePosition * @name setAbsolutePosition
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Object} pos object containing an x and * @param {Object} pos object containing an x and
@ -424,6 +426,8 @@ Kinetic.Node = Kinetic.Class.extend({
* move node by an amount * move node by an amount
* @name move * @name move
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Number} x
* @param {Number} y
*/ */
move: function() { move: function() {
var pos = Kinetic.Type._getXY(Array.prototype.slice.call(arguments)); var pos = Kinetic.Type._getXY(Array.prototype.slice.call(arguments));
@ -475,7 +479,7 @@ Kinetic.Node = Kinetic.Class.extend({
}); });
}, },
/** /**
* move node to top * move node to the top of its siblings
* @name moveToTop * @name moveToTop
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -510,7 +514,7 @@ Kinetic.Node = Kinetic.Class.extend({
} }
}, },
/** /**
* move node to bottom * move node to the bottom of its siblings
* @name moveToBottom * @name moveToBottom
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -524,7 +528,7 @@ Kinetic.Node = Kinetic.Class.extend({
* set zIndex * set zIndex
* @name setZIndex * @name setZIndex
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {int} zIndex * @param {Integer} zIndex
*/ */
setZIndex: function(zIndex) { setZIndex: function(zIndex) {
var index = this.index; var index = this.index;
@ -627,7 +631,7 @@ Kinetic.Node = Kinetic.Class.extend({
* @name transitionTo * @name transitionTo
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Object} config * @param {Object} config
* @config {Number} [duration] duration that the transition runs in seconds * @config {Number} duration duration that the transition runs in seconds
* @config {String} [easing] easing function. can be linear, ease-in, ease-out, ease-in-out, * @config {String} [easing] easing function. can be linear, ease-in, ease-out, ease-in-out,
* back-ease-in, back-ease-out, back-ease-in-out, elastic-ease-in, elastic-ease-out, * back-ease-in, back-ease-out, back-ease-in-out, elastic-ease-in, elastic-ease-out,
* elastic-ease-in-out, bounce-ease-out, bounce-ease-in, bounce-ease-in-out, * elastic-ease-in-out, bounce-ease-out, bounce-ease-in, bounce-ease-in-out,
@ -691,8 +695,8 @@ Kinetic.Node = Kinetic.Class.extend({
return trans; return trans;
}, },
/** /**
* get transform of the node while taking into * get absolute transform of the node which takes into
* account the transforms of its parents * account its parent transforms
* @name getAbsoluteTransform * @name getAbsoluteTransform
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -718,8 +722,7 @@ Kinetic.Node = Kinetic.Class.extend({
return am; return am;
}, },
/** /**
* get transform of the node while not taking * get transform of the node
* into account the transforms of its parents
* @name getTransform * @name getTransform
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -745,8 +748,7 @@ Kinetic.Node = Kinetic.Class.extend({
* clone node * clone node
* @name clone * @name clone
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Object} config used to override cloned * @param {Object} attrs override attrs
* attrs
*/ */
clone: function(obj) { clone: function(obj) {
// instantiate new node // instantiate new node
@ -827,6 +829,13 @@ Kinetic.Node = Kinetic.Class.extend({
* @name toDataURL * @name toDataURL
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Object} config * @param {Object} config
* @param {String} [config.mimeType] mime type. can be "image/png" or "image/jpeg".
* "image/png" is the default
* @param {Number} [config.width] data url image width
* @param {Number} [config.height] data url image height
* @param {Number} [config.quality] jpeg quality. If using an "image/jpeg" mimeType,
* you can specify the quality from 0 to 1, where 0 is very poor quality and 1
* is very high quality
*/ */
toDataURL: function(config) { toDataURL: function(config) {
var mimeType = config && config.mimeType ? config.mimeType : null; var mimeType = config && config.mimeType ? config.mimeType : null;
@ -850,6 +859,15 @@ Kinetic.Node = Kinetic.Class.extend({
* @name toImage * @name toImage
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
* @param {Object} config * @param {Object} config
* @param {Function} callback since the toImage() method is asynchonrous, the
* resulting image object is passed into the callback function
* @param {String} [config.mimeType] mime type. can be "image/png" or "image/jpeg".
* "image/png" is the default
* @param {Number} [config.width] data url image width
* @param {Number} [config.height] data url image height
* @param {Number} [config.quality] jpeg quality. If using an "image/jpeg" mimeType,
* you can specify the quality from 0 to 1, where 0 is very poor quality and 1
* is very high quality
*/ */
toImage: function(config) { toImage: function(config) {
Kinetic.Type._getImage(this.toDataURL(config), function(img) { Kinetic.Type._getImage(this.toDataURL(config), function(img) {
@ -1071,7 +1089,7 @@ Kinetic.Node.addSetters(Kinetic.Node, ['rotationDeg']);
* set detection type * set detection type
* @name setDetectionType * @name setDetectionType
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {String} type can be "path" or "pixel" * @param {String} type can be path or pixel
*/ */
/** /**
@ -1098,14 +1116,14 @@ Kinetic.Node.addSetters(Kinetic.Node, ['rotationDeg']);
*/ */
/** /**
* set drag constraint * set drag constraint.
* @name setDragConstraint * @name setDragConstraint
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {String} constraint * @param {String} constraint can be vertical, horizontal, or none
*/ */
/** /**
* set drag bounds * set drag bounds.
* @name setDragBounds * @name setDragBounds
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Object} bounds * @param {Object} bounds
@ -1131,7 +1149,7 @@ Kinetic.Node.addSetters(Kinetic.Node, ['rotationDeg']);
/** /**
* set offset * set offset
* @name setOffset * @name setOffset a node's offset defines the positition and rotation point
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
* @param {Number} x * @param {Number} x
* @param {Number} y * @param {Number} y
@ -1140,7 +1158,8 @@ Kinetic.Node.addSetters(Kinetic.Node, ['rotationDeg']);
/** /**
* set node scale. * set node scale.
* @name setScale * @name setScale
* @param {Number|Array|Object|List} scale * @param {Number} x
* @param {Number} y
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -1163,7 +1182,7 @@ Kinetic.Node.addSetters(Kinetic.Node, ['rotationDeg']);
*/ */
/** /**
* get detection type * get detection type. Can be path or pixel
* @name getDetectionType * @name getDetectionType
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */
@ -1175,9 +1194,7 @@ Kinetic.Node.addSetters(Kinetic.Node, ['rotationDeg']);
*/ */
/** /**
* get alpha. Alpha values range from 0 to 1. * get alpha.
* A node with an alpha of 0 is fully transparent, and a node
* with an alpha of 1 is fully opaque
* @name getAlpha * @name getAlpha
* @methodOf Kinetic.Node.prototype * @methodOf Kinetic.Node.prototype
*/ */

34
src/Stage.js
View File

@ -92,6 +92,8 @@ Kinetic.Stage = Kinetic.Container.extend({
* set stage size * set stage size
* @name setSize * @name setSize
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
* @param {Number} width
* @param {Number} height
*/ */
setSize: function() { setSize: function() {
// set stage dimensions // set stage dimensions
@ -99,7 +101,7 @@ Kinetic.Stage = Kinetic.Container.extend({
this.setAttrs(size); this.setAttrs(size);
}, },
/** /**
* return stage size * get stage size
* @name getSize * @name getSize
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
*/ */
@ -121,7 +123,8 @@ Kinetic.Stage = Kinetic.Container.extend({
} }
}, },
/** /**
* serialize stage and children as a JSON object * serialize stage and children as a JSON object and return
* the result as a json string
* @name toJSON * @name toJSON
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
*/ */
@ -284,6 +287,15 @@ Kinetic.Stage = Kinetic.Container.extend({
* @name toDataURL * @name toDataURL
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
* @param {Object} config * @param {Object} config
* @param {Function} callback since the stage toDataURL() method is asynchronous,
* the data url string will be passed into the callback
* @param {String} [config.mimeType] mime type. can be "image/png" or "image/jpeg".
* "image/png" is the default
* @param {Number} [config.width] data url image width
* @param {Number} [config.height] data url image height
* @param {Number} [config.quality] jpeg quality. If using an "image/jpeg" mimeType,
* you can specify the quality from 0 to 1, where 0 is very poor quality and 1
* is very high quality
*/ */
toDataURL: function(config) { toDataURL: function(config) {
var mimeType = config && config.mimeType ? config.mimeType : null; var mimeType = config && config.mimeType ? config.mimeType : null;
@ -323,6 +335,15 @@ Kinetic.Stage = Kinetic.Container.extend({
* @name toImage * @name toImage
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
* @param {Object} config * @param {Object} config
* @param {Function} callback since the toImage() method is asynchonrous, the
* resulting image object is passed into the callback function
* @param {String} [config.mimeType] mime type. can be "image/png" or "image/jpeg".
* "image/png" is the default
* @param {Number} [config.width] data url image width
* @param {Number} [config.height] data url image height
* @param {Number} [config.quality] jpeg quality. If using an "image/jpeg" mimeType,
* you can specify the quality from 0 to 1, where 0 is very poor quality and 1
* is very high quality
*/ */
toImage: function(config) { toImage: function(config) {
this.toDataURL({ this.toDataURL({
@ -968,7 +989,7 @@ Kinetic.Node.addGettersSetters(Kinetic.Stage, ['width', 'height', 'throttle']);
*/ */
/** /**
* get throttle * get event throttle for event detections per second.
* @name getThrottle * @name getThrottle
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
*/ */
@ -988,11 +1009,14 @@ Kinetic.Node.addGettersSetters(Kinetic.Stage, ['width', 'height', 'throttle']);
*/ */
/** /**
* set throttle. Increasing the throttle will increase * set throttle for event detections per second. Increasing the throttle will increase
* the number of mousemove and touchmove event detections, * the number of mousemove and touchmove event detections,
* and decreasing the throttle will decrease the number * and decreasing the throttle will decrease the number
* of mousemove and touchmove events which improves performance * of mousemove and touchmove events which improves performance. The event
* throttling is defaulted to 80 event detections per second
* @name setThrottle * @name setThrottle
* @methodOf Kinetic.Stage.prototype * @methodOf Kinetic.Stage.prototype
* @param {Number} throttle * @param {Number} throttle
* @example
* <a href="http://www.html5canvastutorials.com/kineticjs/html5-canvas-load-stage-with-json-string-with-kineticjs/">simple load example</a>
*/ */