imrhung
imrhung

Reputation: 864

PIXI.js - How to draw a half of the circle?

I'm new to PIXI.js to make a game. How can I draw a half of the circle like this without using image?

enter image description here

Thank you in advance!

Upvotes: 7

Views: 8869

Answers (1)

jered
jered

Reputation: 11571

Make sure you read the official documentation before you resort to stackoverflow. :)

Use the PIXI.Graphics class to draw shapes programmatically. It has an arc method for drawing arcs, curves, or parts of circles.

var semicircle = new PIXI.Graphics();
semicircle.beginFill(0xff0000);
semicircle.lineStyle(2, 0xffffff);
semicircle.arc(0, 0, 100, 0, Math.PI); // cx, cy, radius, startAngle, endAngle
semicircle.position = {x: sW/2, y: sH/2};
stage.addChild(semicircle);

https://jsfiddle.net/_jered/kydtg9jq/

Upvotes: 15

Related Questions