canvas-viewport v0.0.3

Canvas viewport

Very simple but convenient implementation of the viewport on canvas

Install

yarn add canvas-viewport

npm i --save canvas-viewport

Usage

Example

    const Viewport = require('canvas-viewport');

    const canvas = document.querySelector('view');
    const ctx = canvas.getContext('2d');

    const viewport = new Viewport(ctx);
    viewport.offset = 20;

    const player = new Player(); // abstract player who moves

    // abstract game loop
    setInterval(() => {
    	viewport.follow(player.x, player.y);
    }, 10);

moving the viewport

Move center of viewport to coordinates by x and y

viewport.center(x, y);

following

// x and y these are the coordinates of the entity that is moving
viewport.follow(x, y);

following offset

Follow if the entity is further than 20 pixels from the center

viewport.offset = 20;
viewport.follow(x, y);

in viewport

Returns true if the entity within the viewport

viewport.in(x, y);