Creating non-connected circles with graphics.arc()

[sambenson]

Hi all, 
I'm using graphics.arc() to make two circles that aren't joined

Here's a basic example - 

As you can see the circles are joined - how do I avoid this? 

Cheers in advance!

[wo997]

Can you specify what do you want to do? Do you want to move them separatelly?

[samid737]

16 hours ago, sambenson said:

Hi all, 
I'm using graphics.arc() to make two circles that aren't joined

Here's a basic example - 

As you can see the circles are joined - how do I avoid this? 

Cheers in advance!

Well if you mean you want them not to be closed arcs, you should remove the 2*PI radian and make it less than 2*PI:

graphics.arc(width/2, height/2, 50, 0, Math.PI);

Will make half of it.

https://en.wikipedia.org/wiki/Arc_(geometry)

if you want them to offset from each other:

 

var width = 800,
    height = 230,
    app = new PIXI.Application(width, height, { antialias: true, transparent: true }),
    graphics = new PIXI.Graphics();

document.body.appendChild(app.view);
app.stage.addChild(graphics);

var startX = width/4 + (Math.cos(0) * 50);
var startY = height/2 + (Math.sin(0) * 50);

graphics.moveTo(startX, startY);

graphics.lineStyle(7, 0xB3B3B3, 1);
graphics.arc(width/4, height/2, 50, 0, Math.PI*2
            );

var startX = width/1.5 + (Math.cos(0) * 100);
var startY = height/2 + (Math.sin(0) * 100);

graphics.moveTo(startX, startY);

graphics.lineStyle(7, 0xBADA55, 1);
graphics.arc(width/1.5, height/2, 100, 0, Math.PI*2
            );