Search code examples
kineticjsellipse

Can't draw ellipse using KineticJS JavaScript Framework v5.1.0


The code I have below draws an ellipse perfectly using kinetic-v4.4.3.min.js script .

When I try to merely reference the newest version the ellipse does not draw.

Here is the code for what does work:

<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
<div id="container"></div>

<script src="http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v4.4.3.min.js"></script>
<script>

    var stage = new Kinetic.Stage({
        container: 'container',
        width: 578,
        height: 200
    });
    var shapesLayer = new Kinetic.Layer();


    var oval = new Kinetic.Ellipse({
        x: 345,
        y: 145,
        radius: [100, 50],
        fill: 'red',
        stroke: 'black',
        strokeWidth: 4,
        listening: false
    });
    shapesLayer.add(oval);

    stage.add(shapesLayer);

</script>
</body>
</html>

So what do I have to do to get the ellipse to draw using KineticJS JavaScript Framework v5.1.0 ??

Switching lib versions does nothing. Meaning

The script tag above breaks the code.

Thanks, Jim


Solution

  • The radius property requires an object {x,y}, not an array.