canvas icon indicating copy to clipboard operation
canvas copied to clipboard

createConicGradient startAngle not working

Open kakha13 opened this issue 1 year ago • 2 comments

Tested on iOS

CODE

<StackLayout width="300" height="300" backgroundColor="black">
      <Canvas ref="canvas" style="width:100%; height:100%" width="300" height="300" @ready="onDraw" />
</StackLayout>
    canvas = args.object
    ctx = canvas.getContext('2d') as CanvasRenderingContext2D;
    canvas.width = canvas.clientWidth;
    canvas.height = canvas.clientHeight;

    const gradient = ctx.createConicGradient(90, canvas.width/2, canvas.height/2);

    // Add five color stops
    gradient.addColorStop(0, 'red');
    gradient.addColorStop(0.25, 'orange');
    gradient.addColorStop(0.5, 'yellow');
    gradient.addColorStop(0.75, 'green');
    gradient.addColorStop(1, 'blue');

    ctx.fillStyle = gradient;
    ctx.fillStyle = gradient;
    ctx.fillRect(20, 20, canvas.width, canvas.width);

gradient Nothing changes

kakha13 avatar Sep 04 '24 20:09 kakha13

What’s the expected output ?

triniwiz avatar Sep 04 '24 21:09 triniwiz

What’s the expected output ?

oldnew I want to get this result but nothing changes. Changed the colors as I wanted, but I still wrote it so you can check it

kakha13 avatar Sep 04 '24 21:09 kakha13

Fixed on the latest webgpu tag

triniwiz avatar Oct 23 '24 21:10 triniwiz

Fixed in https://github.com/NativeScript/canvas/pull/128/commits/b9f3191d0585b4af223a56ccdbd7076c90117a5e the use latest webgpu tag.

triniwiz avatar Nov 05 '24 21:11 triniwiz