search

jonobr1 / two.js

A renderer agnostic two-dimensional drawing api for the web.
https://two.js.org
MIT License
8.29k stars 454 forks source link

How to add a background image to a rectangle？ #653

Open xielonghua opened 2 years ago

xielonghua commented 2 years ago

I want to add a background image to Two.Rectangle. The size of the background image can be increased to the same size as Two.Rectangle.

jonobr1 commented 2 years ago

There's actually not a great way to do that at the moment. This is because the texture formation is inspired with spritesheet animations in mind. To do what you're asking is a different methodology. I tried to reconcile the two, but it's going to take some time.

Likely, it will be easier to set some configurations on Two.Texture whereby the defaults will be what you're asking and Two.Sprite and Two.ImageSequence will implement additional configurations on the under the hood to keep consistency.

You can see my working branch here: https://github.com/jonobr1/two.js/tree/issue-653-texture-sizing

Not a great answer, but in the meantime I recommend making your image content the actual size you want to use it in. Or, you can use it like this: https://codepen.io/jonobr1/pen/rNdZNwM