CODEWITHSUNDEEP
javascripthtmlcanvaskineticjs
Michael
Michael

Reputation: 33297

Kineticjs: fillAlpha() has no effect?

I tried to use the fillAlpha() function of a Kineticjs Shape but it does not change the alpha of the fill color.

Here is what I did: 

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

      var layer = new Kinetic.Layer();

      var circle = new Kinetic.Circle({
        x: stage.getWidth() / 2,
        y: stage.getHeight() / 2,
        radius: 70,
        fill: 'red',
        stroke: 'black',
        strokeWidth: 4
      });

       circle.fillAlpha(0.5);

      // add the shape to the layer
      layer.add(circle);

      // add the layer to the stage
      stage.add(layer);

circle.fillAlpha(0.5); has no effect on the fill.

Here is a JsFiddle for a demo: http://jsfiddle.net/VKNLM/

How can I change the alpha of the fill color?

Upvotes: 0

Views: 325

Answers (1)

lavrton
lavrton

Reputation: 20308

You have to use fill separate with fillRed, fillBlue, fillGreen and fillAlpha. Don't use them together.

So you may do this:

circle.opacity(0.5);

or

var circle = new Kinetic.Circle({
    x: stage.getWidth() / 2,
    y: stage.getHeight() / 2,
    radius: 70,
    fillRed: 255,
    stroke: 'black',
    strokeWidth: 4
  });
circle.fillAlpha(0.5)

Upvotes: 1

Related Questions