Draw hole in a canvas
Re: Draw hole in a canvas
@Keith Baxter
Yes, I figured rapidly that you misunderstood my whole point. Canvas_draw() method is good for SOME purposes, as static image manipulations are for others.
The key here is efficiency.
The OP asked how to create an hollow black mask with a rectangular opening. In Skinman, it takes two seconds to do that(one can even add drop shadows), and one line of code.
Yes, I figured rapidly that you misunderstood my whole point. Canvas_draw() method is good for SOME purposes, as static image manipulations are for others.
The key here is efficiency.
The OP asked how to create an hollow black mask with a rectangular opening. In Skinman, it takes two seconds to do that(one can even add drop shadows), and one line of code.
My YouTube Chanel on the A320 (Real SOPs by an Airline Pilot IRL):
https://www.youtube.com/playlist?list=P ... 0Q6SBASRqJ
https://www.youtube.com/playlist?list=P ... 0Q6SBASRqJ
- Keith Baxter
- Posts: 4674
- Joined: Wed Dec 20, 2017 11:00 am
- Location: Botswana
Re: Draw hole in a canvas
Jacques,JackZ wrote: ↑Wed Apr 28, 2021 5:36 pm @Keith Baxter
Yes, I figured rapidly that you misunderstood my whole point. Canvas_draw() method is good for SOME purposes, as static image manipulations are for others.
The key here is efficiency.
The OP asked how to create an hollow black mask with a rectangular opening. In Skinman, it takes two seconds to do that(one can even add drop shadows), and one line of code.
Does that mean you not going to play anymore.
Keith
AMD RYZEN 9 5950X CPU, Corsair H80I cooler, ASUS TUF GAMING B550-PLUS AMD Ryzen Mother Board, 32Gb ram Corsair Vengeance 3000Mh, MSI GTX960 4G graphics card
Re: Draw hole in a canvas
@Keith Baxter My friend, as you perfectly said, if the goal is to display different techniques and results, why not, but that’s no longer a challenge, as the goals will be different.
I can join though your Discord at some time to show how to use Skinman to create masks with holes for example.
Jacques
I can join though your Discord at some time to show how to use Skinman to create masks with holes for example.
Jacques
My YouTube Chanel on the A320 (Real SOPs by an Airline Pilot IRL):
https://www.youtube.com/playlist?list=P ... 0Q6SBASRqJ
https://www.youtube.com/playlist?list=P ... 0Q6SBASRqJ
- Keith Baxter
- Posts: 4674
- Joined: Wed Dec 20, 2017 11:00 am
- Location: Botswana
Re: Draw hole in a canvas
Awesome Jacques.JackZ wrote: ↑Wed Apr 28, 2021 6:26 pm @Keith Baxter My friend, as you perfectly said, if the goal is to display different techniques and results, why not, but that’s no longer a challenge, as the goals will be different.
I can join though your Discord at some time to show how to use Skinman to create masks with holes for example.
Jacques
Lets do that next week and advertise so that peeps can plan.
I did this quick texture. It can be enhanced. But you get the gist.
I will do lots of ideas and enhancements.
Code: Select all
my_canvas= canvas_add(0,0,800,500)
canvas_draw(my_canvas,function()
_rect(0,0,800,500)
_fill("#2a2a2a")
for i = 0,350 do
_move_to(0+(i*8),0)
_line_to(0,0+(i*8))
_stroke("#515151",1)
end
end)
EDIT:
I am currently sharing my screen so all feel free to pop in and ask questions of simply just watch.
AMD RYZEN 9 5950X CPU, Corsair H80I cooler, ASUS TUF GAMING B550-PLUS AMD Ryzen Mother Board, 32Gb ram Corsair Vengeance 3000Mh, MSI GTX960 4G graphics card
Re: Draw hole in a canvas
It works, thank you
Keith Baxter wrote: ↑Wed Apr 28, 2021 2:13 pm Hi,
A bit more code but _arc() ,_quad_to() ,_ellipse(), _bezier_to() can be used to create shaped viewports.
Note how the last three line in the draw overlap. This is to ensure an overlap. In you version there are transparencies where the rectangles join/meet. I suggest you make them overlap a px or two. But you got the idea.Code: Select all
img_cover=canvas_add(0,0,800,400) canvas_draw(img_cover, function() _move_to(200,50) _line_to(600,50) _line_to(600,350) _line_to(200,350) _line_to(200,0) _line_to(0,0) _line_to(0,400) _line_to(800,400) _line_to(800,0) _line_to(199,0) _line_to(199,50) _line_to(200,50) _fill("red") end)
Keith
Re: Draw hole in a canvas
I have made a “dark” panel, changing the opacity of a black cover. If I use a PNG for black cover I for some reason I get a white rim around the instrument, no matter how much I enlarge the cover to overlap.
However, if I use a vectored black cover it works fine and there is no white rim.
Regards,
AQ
However, if I use a vectored black cover it works fine and there is no white rim.
Code: Select all
img_cover=canvas_add(0,0,512,512)
canvas_draw(img_cover, function()
_circle(256,256,236)
_fill("#000000")
end)
Regards,
AQ
JackZ wrote: ↑Wed Apr 28, 2021 4:59 pm Hmm.
Granted there are many ways to skin a cat, but some are more efficient than others, depending on the Cat. Thought I had made myself clear since last time: canvas is good for dynamic graphics, png images are better suited for permanent background.
So you prepare everything? The idea I had was to discover the final rendering to achieve on the spot,so we can assess the time taken by each solution. if we prepare anything beforehand we could be suspected of cheating, no?
Have never done this on Discord, but why not.
And if you are doing something dynamic, of course canvas is probably the preferred solution! That was all my point from the start, the right tool for the right purpose.
Doing a dynamic texture with still images is probably doable, have never tried. Could you show an example of what you had in mind?...the challenge of creating a static panel background done entirely with canvas() versus the same one done as an image in Skinman.
Jacques
- Keith Baxter
- Posts: 4674
- Joined: Wed Dec 20, 2017 11:00 am
- Location: Botswana
Re: Draw hole in a canvas
Hi,
Looks like you are winning. Great job
Sorry for hijacking the thread.
Keith
Looks like you are winning. Great job
Sorry for hijacking the thread.
Keith
AMD RYZEN 9 5950X CPU, Corsair H80I cooler, ASUS TUF GAMING B550-PLUS AMD Ryzen Mother Board, 32Gb ram Corsair Vengeance 3000Mh, MSI GTX960 4G graphics card
Re: Draw hole in a canvas
If you want a dark circle only without a white border, then you should create a png image of the circle only, the surrounding color being transparent, and save the image under the png format with alpha channel to have the transparency included.a533 wrote: ↑Wed Apr 28, 2021 7:29 pm I have made a “dark” panel, changing the opacity of a black cover. If I use a PNG for black cover I for some reason I get a white rim around the instrument, no matter how much I enlarge the cover to overlap.
However, if I use a vectored black cover it works fine and there is no white rim.
Code: Select all
img_cover=canvas_add(0,0,512,512) canvas_draw(img_cover, function() _circle(256,256,236) _fill("#000000") end)
Regards,
AQ
Standard png format does NOT include alpha channel, and the transparent color is replaced by either white or black.
Jacques
My YouTube Chanel on the A320 (Real SOPs by an Airline Pilot IRL):
https://www.youtube.com/playlist?list=P ... 0Q6SBASRqJ
https://www.youtube.com/playlist?list=P ... 0Q6SBASRqJ
Re: Draw hole in a canvas
I saved my PNG with alpha channel and still got the thin white border around the instrument, see the image above labeled "opacity = 0.9". The thin white border started to show at apacity above 0.8. As you see at opacity 0.5 it almost doesn't show. I can send the source to you if you want. The only way to avoid it was to use a vectored circle in a canvas as a cover instead of the png.If you want a dark circle only without a white border, then you should create a png image of the circle only, the surrounding color being transparent, and save the image under the png format with alpha channel to have the transparency included.
Standard png format does NOT include alpha channel, and the transparent color is replaced by either white or black.
Jacques
AQ
Re: Draw hole in a canvas
Hmm weird. I suspect that the cover color is perhaps not 100% black?
My YouTube Chanel on the A320 (Real SOPs by an Airline Pilot IRL):
https://www.youtube.com/playlist?list=P ... 0Q6SBASRqJ
https://www.youtube.com/playlist?list=P ... 0Q6SBASRqJ