Wrong sprite.y displaying

[Timofii]

Hi! When i increment sprite.y coordinate inside the game loop, the sprite moves to bottom, like y increment is below zero. Console values of increment and sprite.y is above zero.

Attaching my code:

let renderer, stage, character, sprite;
const alpha = 45, tanAlpha = Math.tan(alpha / 180*Math.PI);

function setup () {
    renderer = PIXI.autoDetectRenderer(
        {backgroundAlpha: 0});

    character = PIXI.Texture.from('Content\\images\\slogosb.png');

    stage = new PIXI.Container();

    sprite = new PIXI.Sprite(character);

    stage.addChild(sprite);

    document.getElementById('view').appendChild(renderer.view);

    animate();
}


function animate () {
//Loop this function 60 times per second
    requestAnimationFrame(animate);
    //Move the sprite 1 pixel per frame
    sprite.x += 0.5;
    sprite.y = sprite.x * tanAlpha;
    //Render the stage
    renderer.render(stage);
}

setup();

[ivan.popelyshev]

> i increment sprite.y coordinate

> the sprite moves to bottom,

in which environment/framework/whatever you coded graphics applications before?  I have a surprise for you: in most of 2d apps,  Y is going doooooown.

[b10b]

Yep ... think of it as "reading a page" rather than "flying a plane" then it'll make a bit more sense until it becomes automatic.

Why is Y down?  iirc it's to do with gravity, and how on early raster displays there are no lines, just a gradual droop of the ray with a period return of the X, and a period return of the Y as a multiple of the X period.