How to use the canvas/graphics/Fill.js function in canvas

To help you get started, we’ve selected a few canvas examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github photonstorm / lazer-dev / src / canvas / canvas21-drawImage2.js View on Github external
loadComplete (file) {

        const ctx = GetContext(this.canvas);

        Fill(ctx, 120, 0, 120);

        //  Draw the image at 400x300
        // DrawImage(ctx, file.data, { x: 400, y: 300 });

        //  Draw the image at 400x300 centered (anchor 0.5)
        DrawImage(ctx, file.data, { x: 400, y: 300, anchorX: 0.5, anchorY: 0.5 });

    }
github photonstorm / lazer-dev / src / canvas / canvas21-drawImage1.js View on Github external
loadComplete (file) {

        const ctx = GetContext(this.canvas);

        Fill(ctx, 120, 0, 120);

        //  Draw the image at 0x0 with no arguments at all
        DrawImage(ctx, file.data);

    }
github photonstorm / lazer-dev / src / canvas / canvas21-drawImage4.js View on Github external
loadComplete (file) {

        const ctx = GetContext(this.canvas);

        Smoothing.disable(ctx);

        Fill(ctx, 120, 0, 120);

        DrawImage(ctx, file.data, { 
            x: 400, y: 300, 
            anchorX: 0.5, anchorY: 0.5, 
            scaleX: 4, scaleY: 4, 
            rotate: DegToRad(45) 
        });

    }
github photonstorm / lazer-dev / src / canvas / canvas21-drawImage5.js View on Github external
loadComplete (file) {

        const ctx = GetContext(this.canvas);

        Smoothing.disable(ctx);

        Fill(ctx, 120, 0, 120);

        DrawImage(ctx, file.data, { 
            x: 400, y: 300, 
            width: 16,
            anchorX: 0.5, anchorY: 0.5, 
            scaleX: 4, scaleY: 4, 
            rotate: DegToRad(45) 
        });

    }
github photonstorm / lazer-dev / src / canvas / canvas21-drawImage6.js View on Github external
loadComplete (file) {

        const ctx = GetContext(this.canvas);

        Smoothing.disable(ctx);

        Fill(ctx, 120, 0, 120);

        DrawImage(ctx, file.data, { 
            x: 400, y: 300, 
            srcWidth: 32,
            anchorX: 0.5, anchorY: 0.5, 
            scaleX: 4, scaleY: 4, 
            rotate: DegToRad(45) 
        });

    }
github photonstorm / lazer-dev / src / canvas / canvas21-drawImage7.js View on Github external
loadComplete (file) {

        const ctx = GetContext(this.canvas);

        Smoothing.disable(ctx);

        Fill(ctx, 120, 0, 120);

        DrawImage(ctx, file.data, { 
            x: 200, y: 200, 
            scaleX: 2, scaleY: 2
        });

        DrawImage(ctx, file.data, { 
            x: 350, y: 200, 
            scaleX: 2, scaleY: 2,
            blendMode: 'lighter'
        });

        DrawImage(ctx, file.data, { 
            x: 500, y: 200, 
            scaleX: 2, scaleY: 2,
            blendMode: 'overlay'
github photonstorm / lazer-dev / src / canvas / canvas21-drawImage3.js View on Github external
loadComplete (file) {

        const ctx = GetContext(this.canvas);

        Smoothing.disable(ctx);

        Fill(ctx, 120, 0, 120);

        DrawImage(ctx, file.data, { x: 200, y: 200, scaleX: 4, scaleY: 4 });

    }