Jump to content

How use Pixi with filter Pixilate?


Recommended Posts

Hi all! 

I make the first steps with the Pixi and I need help.

I want to take a picture from canvas and applied to the image Pixelate filter (as here http://www.goodboydigital.com/pixijs/examples/15/indexAll.html).

pondFloorTexture = PIXI.Texture.fromImage("img/image.jpg");//work!
pondFloorTexture = PIXI.Texture.fromCanvas(document.querySelector("#mycanvas"));//not work(

No errors, but it does not work

Link to comment
Share on other sites

Oops!  I'm sorry. If you do not only paint the background of the canvas, and draw something - Pixi will draw all. If only the background is painted - it is perceived transparent

var can = document.querySelector("#mycanvas");
      if (can.getContext) {
        var ctx3 = can.getContext("2d");

        ctx3.fillStyle = "rgb(200,0,0)";
        ctx3.fillRect (10, 10, 50, 50);

        ctx3.fillStyle = "rgba(0, 0, 200, 0.5)";
        ctx3.fillRect (30, 30, 50, 50);
pondFloorTexture = PIXI.Texture.fromCanvas(can);//all work

The next step is to apply the filter Pixelate

Edited by htmllab
not select code snippet
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...