?
2 Likes
Could you make a Tutorial on how to make 3D engines? Because I am kinda confused about how that works.
There heaps of tutorials online on how to make 3D engines from scratch.
I highly reccommend following along with this tutorial series. It’s simple and easy to follow along and port to CanvasDraw as the concept and code logic is exactly the same.
This is the tutorial I followed to make my own 3D rasterizer on roblox.
Should be easy enough to port to lua too if you understand any other programming language
3 Likes
Graphics/Image Update - v3.4.0
Hey all. Pretty big update regarding graphics and rendering with CanvasDraw and lots of bug fixes too.
Well, we have a bit to get through, so lets start from the top!
Two new methods - DrawTexturedTriangle and DrawDistortedImage
That’s right, you heard it. CanvasDraw now officially supports textured triangles and planes with basic transparency support!
These methods can be used for 3D rendering or custom 2D image manipulation!
DrawTexturedTriangle will also take UV coordinates too
These drawing methods also support automatic edge clipping! So don’t worry about script errors or issues from rendering outside the canvas!
Special thanks to @ZestyIsSour for contributing and helping out with this one!
Two new methods for ImageData
ImageData now has two new methods: Tint() and SetPixel()
The Tint() method is useful for shading or changing an image’s colour.
The SetPixel() method allows you to change the ImageData’s pixels directly. SetPixel accepts both a color3 and an alpha/transparency value too!
Automatically clipping for some drawing methods
The following methods have now been updated and will automatically clip with the canvas to avoid causing errors or issues with drawing outside the canvas.
Currently, only the following drawing methods will now have clipping:
- DrawRectangle / DrawRectangleXY
- DrawText / DrawTextXY
- DrawImage / DrawImageXY
- DrawTexturedTriangle / DrawTexturedTriangleXY
- DrawDistortedImage / DrawDistortedImageXY
Rewritten FloodFIll()!
The FloodFill method has had a complete overall and now runs much faster and is now practical!
Special thanks to @Arevoir for this one!
Full change log:
-
Added DrawTexturedTriangle()
-
Added DrawDistortedImage()
-
Added two new ImageData methods:
- ImageData:Tint()
- ImageData:SetPixel()
-
Made text much more reliable and not error. Text will now clip
to the canvas and properly wrap depending on text size and position -
Gave the DrawRectangle method clipping
-
Gave the DrawText method clipping
-
Gave the DrawImage method clipping
-
Redone the API documentation thread and added a table of contents section for quick and easy searching
-
Rewritten FloodFill to be much faster than before (contributed by @Arevoir)
-
Fixed DrawRectangle not drawing correctly when coordinates were flipped for either axis
-
Fixed some wrapping issues with DrawText
10 Likes
this is actually so cool. Will defiently try later!
1 Like
Have you thought about using this method for optimizing even further The Powder Box - Roblox ?
Like, how the guy in the post makes almost NOTHING render in the background?
2 Likes
That is probably a good idea. Would probably speed up the game a little bit. Thanks
2 Likes
this script i made does not seem to work that well, what am i doing wrong?
what script? we cannot help unless you at least provide code or an image/video of your problem
i forgot to paste it sorry. here is the script: `
Gui.Save_drawing.MouseButton1Click:Connect(function()
-- Define the region to capture
local PointA = Vector2.new(0, 0)
local PointB = Vector2.new(255, 255)
local ImageData = Canvas:CreateImageDataFromCanvas(PointA, PointB)
local SaveObject = CanvasDraw.CreateSaveObject(ImageData)
SaveObject.Name = "MyDrawing"
SaveObject.Parent = Saves
end)
Gui.Load_drawing.MouseButton1Click:Connect(function()
local LoadImage = Saves.MyDrawing
local ImageData = CanvasDraw.GetImageData(LoadImage)
Canvas:DrawImage(ImageData, Vector2.new(255, 255))
Saves.MyDrawing:Destroy()
end)
`
maybe this is your problem. It looks like you are drawing outside the canvas entirely.
Image’s start at 1, 1 on the canvas. And if you canvas is 255x255, you are drawing your image almost entirely outside the canvas
Also you might wanna refer to API documentation sometimes as it describes the parameters of how the drawing functions work
1 Like
how do i know the bottom right corner of my canvas? im using. local Canvas = CanvasDraw.new(Frame)
You specify the resolution in the parameters of CanvasDraw.new().
This is mentioned on the API documentation also
local Canvas = CanvasDraw.new(Frame, Vector2.new(255, 255))
without this parameter, it will default to 100x100
1 Like
is it possible to rotate a image? i need to know if there’s a way to do so without using DrawTexturedTriangle for rotated images
The easiest and most efficient way to rotate an image is to use DrawDistortedImage with sin and cos rotation maths. It’s the simplest and honestly very fast too.
1 Like
Patch - v3.4.1
- Fixed DrawImage/XY not drawing correctly when aspect ratio wasn’t square
- Fixed some clipping errors with the image-based drawing functions
- Other mild bug fixes and improvements
3 Likes
It would be more than nice if the module includes a way to enable some sort of layer containing a grid so people have an idea of where they’re placing down pixels (if using the free draw). Right now I have my own code inside the module, but it’s quite annoying having to add my changes to every update you make.
Is this something we could see added? Thanks
1 Like
Hmm. A grid wasn’t ever planned to be in the engine, as overlaying an imagelabel with tiling can be done outside the module. Just requires a bit of math for the resolution and aspect ratio
I might add a grid overlay as a property to the Canvas, that’s easy enough to do
1 Like
Yeah its a bit far fetched, but for people that want to use the free draw feature for just placing pixels, a grid property could be super helpful.
Creating my own is do-able but quite the hassle when it’s being updated a-lot.
Really solid module btw.
1 Like
I’m having a strange issue with the image importer plugin, roblox studio seems to freeze up and crash entirely when I try to open the plugin (i just left-clicked on it’s icon). I waited several minutes but it did nothing, I’m not really sure what’s wrong, am I somehow doing something wrong?