Question

我正在使用多个Kinetic.Wedges和一个移动部件的补间创建饼图。

这很好用，但是当我尝试添加

时

shadowColor: 'black',
shadowBlur: 2,
shadowOffset: 10,
shadowOpacity: 0.5

在wedge实例化中它会出错 - 出现错误“TypeError：b is undefined”。如果我注释掉补间实例化，形状加载没有错误（带阴影）所以我怀疑补间实例化中的某些东西导致它。

这是用于此目的的代码。

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

var splits = [{perc: 30, colour: "red"},
      {perc: 15, colour: "blue"},
      {perc: 20, colour: "green"},
      {perc: 35, colour: "yellow"}]; 

var layer = new Kinetic.Layer();
var startPos = 0;

for (var i = 0; i < splits.length; i++){
(function(){
    var wedge = new Kinetic.Wedge({
        x: stage.getWidth() / 3,
        y: stage.getHeight() / 2,
        radius: 70,
        angleDeg: toAngleDeg(splits[i].perc),
        fill: splits[i].colour,
        stroke: 'black',
        strokeWidth: 1,
        rotationDeg: startPos});

    layer.add(wedge);

    wedge.tween = new Kinetic.Tween({
        node: wedge,
        rotationDeg: 90 + (180 - (toAngleDeg(splits[i].perc)/2)),
        x: stage.getWidth() / 1.5,
        easing: Kinetic.Easings.EaseInOut});

    startPos += toAngleDeg(splits[i].perc);

    wedge.on('mouseup', function(){
        wedge.setZIndex(100);
        wedge.tween.play();}
            );
     })()}
     stage.add(layer);

我在这里做错了什么？

KineticJS：在形状上设置阴影，导致补间错误

0 个答案: