Drawing sprite from coords to coords

[Virgil]

Hi guys,

I want to draw a sprite (sort of a decorative line png, like 5 pixels wide and 200 pixels in height) from one coordinate to the another. 

So it needs to scale and rotate. 

Maybe if I set the pivot or anchor point (whats the difference?) I want something like drawSpriteToCoords(xSource, ySource, xDestination, yDestination)

Thanks!

[ivan.popelyshev]

sprite.anchor.set(0.5, 0.0);
sprite.position.set(x1, y1);
var dx = x2-x1, dy = y2-y1;
sprite.rotation = Math.atan2(dy, dx) - Math.PI/2;
sprite.height = Math.sqrt(dx*dx*+dy*dy);

 

[Virgil]

Awesome thanks @ivan.popelyshev I was already trying something like this out. This is perfect, I'll give it a shot!

[ivan.popelyshev]

May the Math be with you!

Also, dont forget that "height = xxx" is actually setting "scale.y = xxx / texture.height"

var texture = new PIXI.Texture(brushTexture, brushTexture.frame.clone());
//now we have new texture!

var sprite = new PIXI.Sprite(texture);

...

//sprite.height = ..
texture.frame.height = Math.min(Math.sqrt(dx*dx+dy*dy), brushTexture.height);
texture._updateUvs();

 

[Virgil]

@ivan.popelyshev is that reply for me?

The sprite goes into the right rotation but the scaling seems to go off?

http://www.klash.nl/dump/pixi/test-pixi-line2.html

[Virgil]

2 hours ago, ivan.popelyshev said:

sprite.anchor.set(0.5, 0.0);
sprite.position.set(x1, y1);
var dx = x2-x1, dy = y2-y1;
sprite.rotation = Math.atan2(dy, dx) - Math.PI/2;
sprite.height = Math.sqrt(dx*dx*+dy*dy);

 

Ah! Got it, you had a small typo.

Should be;

sprite.height = Math.sqrt(dx*dx+dy*dy);