Jump to content

Having radial gradient below canvas

Alexander Farber

Recommended Posts

Good evening,

with pixi.js 5.2.1 (and I am using pixi-legacy too) what is please the approach to have a radial background below the canvas or maybe drawn on it?

I have searched for suggestions, but they are few years old.

I have tried CSS-styling the canvas element with:

#myCanvas {
        background: radial-gradient(#e66465, #9198e5);
        border: 4px dotted red;

And commented the backgroundColor in the Javascript code (in the hope it would become transparent):

var app = new PIXI.Application({
       width: 1000,
       height: 500,
       view: document.getElementById('myCanvas'),
       // backgroundColor: 0xFFFFFF,
       antialias: true

but only the border was showing some of the gradient - please see the screenshot attached.

Thank you

Screenshot 2020-04-22 at 23.08.46.png

Edited by Alexander Farber
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...