Jump to content

How to change the fill color?


Recommended Posts

I have noticed that when using primitives there is one property directly on the PIXI.Graphics instance, and another one on the elements of array graphicsData.

However, changing both of them still gives no result, although I remember at one point I was messing with something and I got the color changed but cant remember what was it that I did :/



Link to comment
Share on other sites

You can't "change" the color of something you have previously drawn. It's like working with a canvas context, the pixels are drawn forever, and if you want to change something, you have to clear it and redrawn what you want. For example: http://jsfiddle.net/cE7F8/1/

But you can add it to a DisplayObjectContainer then move the DOC if you need to change the graphic position without redrawing everything. You can also generate a texture of a graphic with youGraphic.generateTexture(), then create a sprite with the generated texture and finally tint the sprite.

Link to comment
Share on other sites

If you could change the tint, why wouldn't you be able to change the fill color?

The tint action affect the texture of a sprite. A pixi graphic is not a texture, its a canvas's context (I don't know how it works for webgl). A canvas is like a black board, when you use drawCircle, the canvas do not remember that you drawn a circle, he just know which pixel on the board you have colored. So you have to erase or redraw on top.

But you can also use a globalCompositeOperation to affect all the values of the pixels of the graphic's canvas. This is how the Canvas Renderer works for tinting a sprite. He draw the pixels of the sprite's texture on a canvas, do a globalCompositeOperation, then save the canvas as a texture and update the sprite's texture. https://github.com/GoodBoyDigital/pixi.js/blob/master/src/pixi/renderers/canvas/utils/CanvasTinter.js#L29

But redrawing your graphic seems a better idea to change its color.

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...