mirror of
https://github.com/konvajs/konva.git
synced 2025-09-19 10:47:59 +08:00
added lots of constructor example docs
This commit is contained in:
@@ -60,6 +60,22 @@ var Kinetic = {};
|
||||
* @param {Object} config
|
||||
* {{ShapeParams}}
|
||||
* {{NodeParams}}
|
||||
* @example
|
||||
* var customShape = new Kinetic.Shape({<br>
|
||||
* x: 5,<br>
|
||||
* y: 10,<br>
|
||||
* fill: 'red',<br>
|
||||
* // a Kinetic.Canvas renderer is passed into the drawFunc function<br>
|
||||
* drawFunc: function(canvas) {<br>
|
||||
* var context = canvas.getContext();<br>
|
||||
* context.beginPath();<br>
|
||||
* context.moveTo(200, 50);<br>
|
||||
* context.lineTo(420, 80);<br>
|
||||
* context.quadraticCurveTo(300, 100, 260, 170);<br>
|
||||
* context.closePath();<br>
|
||||
* canvas.fillStroke(this);<br>
|
||||
* }
|
||||
*});
|
||||
*/
|
||||
Kinetic.Shape = function(config) {
|
||||
this._initShape(config);
|
||||
@@ -88,6 +104,12 @@ var Kinetic = {};
|
||||
* @param {String|DomElement} config.container Container id or DOM element
|
||||
* {{NodeParams}}
|
||||
* {{ContainerParams}}
|
||||
* @example
|
||||
* var stage = new Kinetic.Stage({<br>
|
||||
* width: 500,<br>
|
||||
* height: 800,<br>
|
||||
* container: 'containerId'<br>
|
||||
* });
|
||||
*/
|
||||
Kinetic.Stage = function(config) {
|
||||
this._initStage(config);
|
||||
@@ -104,6 +126,8 @@ var Kinetic = {};
|
||||
* to clear the canvas before each layer draw. The default value is true.
|
||||
* {{NodeParams}}
|
||||
* {{ContainerParams}}
|
||||
* @example
|
||||
* var layer = new Kinetic.Layer();
|
||||
*/
|
||||
Kinetic.Layer = function(config) {
|
||||
this._initLayer(config);
|
||||
@@ -117,6 +141,8 @@ var Kinetic = {};
|
||||
* @param {Object} config
|
||||
* {{NodeParams}}
|
||||
* {{ContainerParams}}
|
||||
* @example
|
||||
* var group = new Kinetic.Group();
|
||||
*/
|
||||
Kinetic.Group = function(config) {
|
||||
this._initGroup(config);
|
||||
|
@@ -494,7 +494,7 @@
|
||||
* // move node in x direction by 1px<br>
|
||||
* node.move({<br>
|
||||
* x: 1<br>
|
||||
* })
|
||||
* });
|
||||
*/
|
||||
move: function() {
|
||||
var pos = Kinetic.Util._getXY([].slice.call(arguments)),
|
||||
@@ -721,7 +721,7 @@
|
||||
* // fire custom event with custom event object<br>
|
||||
* node.fire('foo', {<br>
|
||||
* bar: 10<br>
|
||||
* });<br>
|
||||
* });<br><br>
|
||||
*
|
||||
* // fire click event that doesn't bubble<br>
|
||||
* node.fire('click', null, false);
|
||||
@@ -908,7 +908,7 @@
|
||||
* callback: function(img) {<br>
|
||||
* // do stuff with img<br>
|
||||
* }<br>
|
||||
* })
|
||||
* });
|
||||
*/
|
||||
toImage: function(config) {
|
||||
Kinetic.Util._getImage(this.toDataURL(config), function(img) {
|
||||
|
@@ -11,6 +11,14 @@
|
||||
* @param {Number} [config.tension] default value is 1. Higher values will result in a more curvy line. A value of 0 will result in no interpolation.
|
||||
* {{ShapeParams}}
|
||||
* {{NodeParams}}
|
||||
* @example
|
||||
* var blob = new Kinetic.Blob({<br>
|
||||
* points: [73, 140, 340, 23, 500, 109, 300, 170],<br>
|
||||
* tension: 0.8,<br>
|
||||
* fill: 'red',<br>
|
||||
* stroke: 'black'<br>
|
||||
* strokeWidth: 5
|
||||
* });
|
||||
*/
|
||||
Kinetic.Blob = function(config) {
|
||||
this._initBlob(config);
|
||||
|
@@ -8,6 +8,24 @@
|
||||
* @param {Number} config.radius
|
||||
* {{ShapeParams}}
|
||||
* {{NodeParams}}
|
||||
* @example
|
||||
* // create simple circle
|
||||
* var circle = new Kinetic.Circle({<br>
|
||||
* radius: 5,<br>
|
||||
* fill: 'red',<br>
|
||||
* stroke: 'black'<br>
|
||||
* strokeWidth: 5
|
||||
* });
|
||||
*
|
||||
* // create ellipse
|
||||
* var circle = new Kinetic.Circle({<br>
|
||||
* radius: 5,<br>
|
||||
* fill: 'red',<br>
|
||||
* stroke: 'black'<br>
|
||||
* strokeWidth: 5,<br>
|
||||
* scaleX: 2,<br>
|
||||
* strokeScaleEnabled: false
|
||||
* });
|
||||
*/
|
||||
Kinetic.Circle = function(config) {
|
||||
this._initCircle(config);
|
||||
|
@@ -14,6 +14,18 @@
|
||||
* @param {Object} [config.crop]
|
||||
* {{ShapeParams}}
|
||||
* {{NodeParams}}
|
||||
* @example
|
||||
* var imageObj = new Image();<br>
|
||||
* imageObj.onload = function() {<br>
|
||||
* var image = new Kinetic.Image({<br>
|
||||
* x: 200,<br>
|
||||
* y: 50,<br>
|
||||
* image: imageObj,<br>
|
||||
* width: 100,<br>
|
||||
* height: 100<br>
|
||||
* });<br>
|
||||
* };<br>
|
||||
* imageObj.src = '/path/to/image.jpg'
|
||||
*/
|
||||
Kinetic.Image = function(config) {
|
||||
this._initImage(config);
|
||||
|
@@ -8,6 +8,14 @@
|
||||
* @param {Number} [config.cornerRadius]
|
||||
* {{ShapeParams}}
|
||||
* {{NodeParams}}
|
||||
* @example
|
||||
* var rect = new Kinetic.Rect({<br>
|
||||
* width: 100,<br>
|
||||
* height: 50,<br>
|
||||
* fill: 'red',<br>
|
||||
* stroke: 'black'<br>
|
||||
* strokeWidth: 5
|
||||
* });
|
||||
*/
|
||||
Kinetic.Rect = function(config) {
|
||||
this._initRect(config);
|
||||
|
Reference in New Issue
Block a user