Custom design in kinetic.js

<html>
<body>
<div id=”container”></div>
<script src=”http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v5.0.0.min.js”></script&gt;
<script defer=”defer”>
var stage=new Kinetic.Stage({
container:’container’,
width:578,
height:200
});
var layer=new Kinetic.Layer();
var triangle=new Kinetic.Shape({
sceneFunc: function(context){
context.beginPath();
context.moveTo(200,50);
context.lineTo(420,80);
context.quadraticCurveTo(300, 100, 260, 170);
context.closePath();
context.fillStrokeShape(this);
},
fill: ‘#00D2FF’,
stroke: ‘black’,
strokeWidth: 4
});
layer.add(triangle);
stage.add(layer);
</script>
</body>
</html>

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s