Kinetic.Path使用svg数据

时间:2014-08-03 19:44:33

标签: javascript svg kineticjs

我是svg和Kinetic.js的新手。我在Kinetic.Path中复制了一些字符串作为数据字符串,但它不起作用。但是,如果我在html中添加它,它可以工作。 Code here

<svg width="500" height="500">
        <path d='M 145,225 A 88,75 0 1 1 432,228' />
</svg>

以下是我的代码。在Kinetic.js中svg路径数据字符串是否不同?

$(document).ready(function () {
// intial stage and layer
var stage = new Kinetic.Stage({
    container: "container",
    width: $("#container").width(),
    height: $("#container").height()
});
var layer = new Kinetic.Layer();

stage.add(layer);
stage.draw();
drawPath();

function drawPath() {
    var path = new Kinetic.Path({
        x: 240,
        y: 40,
        //data: 'M 100 100 L 200 200 z', // doesn't work
        //data: 'M100,200 C100,100 400,100 400,200', // doesn't work. Copied from http://www.w3.org/TR/SVG11/images/paths/cubic02.svg
        //data: 'M100 200 C100 100 400 100 400,200', // doesn't work.
        //data: 'M150 0 L75 200 L225 200 Z', // works
        //data: 'M 145,225 A 88,75 0 1 1 432,228', // doesn't work. Copied from http://users.ecs.soton.ac.uk/rfp07r/interactive-svg-examples/arc.html
        //data: 'M 145,225 A 88,75 0 1 1 432,228', // doesn't work. Copied from http://users.ecs.soton.ac.uk/rfp07r/interactive-svg-examples/arc.html
        fill: 'green',
        draggable: true,
        scale: 2
    });
    layer.add(path);

    layer.draw();
}

});

0 个答案:

没有答案