3

This is the first time around that I am using some js,otherwise I always rely on hardcoding.Probably this is the reason why I am facing some issues in understanding the syntax of kineticjs. I saw some

 1. Tween
 2. layer(add)
 3. stage(add)
 4. var rect=new kinetic.rect{//some code with property:value,}

I am familiar with constructor and creating instances of it.But I am finding it difficult to understand the syntax of kineticjs.What are the above things used for,i have no idea.I tried searching but I din`t get what I was looking for. I have a project in which I need to increase the height of bezier curve with transition.Kineticjs seems to be the only solution for this. So my question is how to define my own custom function in kineticjs and how to call it with respect to the kineticjs syntax?

this is what I have done so far!!!

2 Answers2

1
  1. Tweens are used to animate a node from one state into another state. For example, you can use Tweens to animate a rectangle from position x=10 to x=50

  2. this adds a node to a layer. You can add groups and shapes to layers

  3. this adds a layer to the stage. Layers are tied to an HTML5 canvas

  4. this instantiates a new rectangle. Here's the full documentation on rectangles: http://kineticjs.com/docs/Kinetic.Rect.html

For more info, take a look at the "how it works page"

https://github.com/ericdrowell/KineticJS/wiki

Eric Rowell
  • 5,191
  • 23
  • 22
  • :thx for the answer.i have understood how it works. But when it comes to instantiating,i am facing a problem!!!this is the link http://stackoverflow.com/questions/17002709/how-to-create-object-and-instance-in-kineticjs –  Jun 09 '13 at 08:36
  • 1
    :some random person in this universe comes up with a question,and look who replies..the creator itself.. thanks stackOverflow!!!! –  Jun 10 '13 at 07:26
  • :kinetic have inbuilt functionality for circle,rect when you want to do some animation.but what when if you want to some animation with bezier curve.This is the link for what I have done http://stackoverflow.com/questions/17026783/how-to-add-movements-to-bezier-curve-in-kineticjs –  Jun 11 '13 at 12:46
1

Try to watch this youtube video. Its a presentation from the founder of kineticjs. He talk about HTML5 graphics frameworks in generale in the start, but if you go to time 39:45, then he talks about exactly the things you are asking about. He is giving a live coding example which makes it very easy to understand. Check it out:

http://www.youtube.com/watch?v=ZS6QqNJ0VRA

Poku
  • 3,138
  • 10
  • 46
  • 64