This issue was moved to a discussion.
You can continue the conversation there. Go to discussion →
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
How to apply a clipping artefact to a specific image artefact only? (Question) #22
Comments
There's a few of ways you can do this. The simplest is probably to use the (Note that you don't need to include default values when defining the entitys)
[1] - you can get an idea of GCO effects in demo canvas028 - https://scrawl-v8.rikweb.org.uk/demo/canvas-028.html An alternative is to use a group to do the clipping for you - see demo canvas-042 for examples - https://scrawl-v8.rikweb.org.uk/demo/canvas-042.html The group approach works by putting all the entitys into the same group. The wheel-clip entity should be applied first (with |
Struggled until I saw that the wheel is not a clip! Thanks, this works great. For those reading this and having a similar problem, I can add to this topic that the difference between globalCompositeOperation: 'source-in' and globalCompositeOperation: 'source-atop' is: In this scenario there is only a difference if the image has transparency. In that case effectively, when using source-in, the transparancy "overwrites" the fill color of the wheel. Using 'source-atop', the transparancy is actually transparent, revealing the fill color of the underlying wheel.
This solves this problem, closing the "issue". |
This issue was moved to a discussion.
You can continue the conversation there. Go to discussion →
The demo's do sometimes a bit too much, which makes it a little more difficult to disect the information you're trying to learn form them. However, after working with it for a few hours and reading through the tutorials I came very close to my goals, and must say that it's a very capable library, although I have no experience with other similar ones, I am absolutely very happy choosing this one for my little project.
There is however one thing that I have so far not been able to figure out, and that is how to apply clipping to only certain artefacts (and probably by extension, grouping, as I have a feeling it might be accomplished through groups). This screenshot shows the issue, there are two images, a background (the person in the suit) and a foreground (the ring which is a transparent png, with some shading on the inside of the ring. Then there is a third artefact, a wheel-clip, which I want to ONLY apply to the background image.
I have been playing around with
order
and groups, but have been so far unsuccesful.At the end of the 'struggle', this was the code producing the screenshot above (as you may notice there are is a variable scale and postioning, which I took from the Pan&Zoom example ;-) ):
The text was updated successfully, but these errors were encountered: