CanvasDraw - A powerful pixel-based graphics library (Draw pixels, lines, triangles, read/modify image data, and much more!)

I was considering that! I’m just sad that the Tri draw call has even more artifacts than I thought. :,(

1 Like

I dont even know why, i assume my math somewhere is slightly off, but if someone can figure out the issue that would be amazing

1 Like

:broken_heart:​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

is there still a possibility that the pixel fix could be looked into soon? I’d love to get back to it

1 Like

Now we can literally re-create Doom also in roblox studio :skull:

Btw very nice work

1 Like

I look into it again possibly today or tomorrow and see if i can do a fix

1 Like

I dont seem to be having this issue. Can you send the sprite you used to test this?

image image

image

Just make sure to remove the background colors :slight_smile:

1 Like

I tested the top row one and it seems to work perfectly fine at scales 1, 2 and 3. I am having no distortion issues with the scale.

Are you using the latest version of CanvasDraw?

Here was my test spritesheet I made:
image-1.png (59) 64x16
image-1.png (60)

Hi, this is what it looks like for me, even after using a different version


This is what it looks like fullscaled, it still has those tiny extras pixels :frowning:

RobloxStudioBeta_HFRPYUlnPH

Can you send me a repo? I’ll take a look

1 Like

Sure! Add me on Discord.
my username is aunarky

we living :speaking_head::speaking_head::speaking_head::speaking_head::speaking_head::speaking_head:​​​​​​​​​​​​​​​​​​​​​​

Module Update - v4.8.0.b


Hey all. This update introduces a couple of new things. The biggest and most important change is that the canvas method DrawImageRect has been reworked and has changed slightly.


Canvas:DrawImageRect() changes:

  • This method no longer uses textured triangles to render a rect. This means that there are no jagged texturing distortions at decimal scales or uneven texture scales.

  • Added FlipX and FlipY boolean parameters for a native way to flip a sprite/image within an image rect region

  • Removed the angle parameter due to much more simplistic and faster rendering method. This parameter also didn’t really serve much use paired up with this method.

  • The rendering speed of this method has been increased by about 15%. There is also no more overdrawing issues.

  • Alpha blending is now supported!

Parameter changes can be visualised here:

Canvas:DrawImageRect(
    ImageData,    -- Our image/texture
    Point,        -- The origin point
    ReftOffset,   -- Rect offset in pixels
    RectSize,     -- Rect size in pixels
    Scale,        -- Scale percentage
    FlipX,        -- Flips the rect horizontally
    FlipY,        -- Flips the rect vertically
    AlphaBlending -- Enables true transparency blending
)

New canvas method; Canvas:ViewportToCanvasPoint()

This new client sided method can come in handy when working with screen or viewport points as this method transforms them to canvas pixel points.

This method behaves very similarly to Canvas:GetMousePoint(), but instead takes Vector2 position parameter and returns a Vector2 canvas point, regardless if it is within or outside of the canvas.

local ScreenPos = Vector2.new(1920, 1080) -- Bottom right corner of a standard 1080p screen
local CanvasPoint = Canvas:ViewportToCanvasPoint(ScreenPos)

print(CanvasPoint)

CanvasDraw4.8.0.b.rbxm (65.0 KB)

2 Likes

Module and Plugin Update - v4.9.0.b

Fixes and Memory Improvements

  • Fixed module and plugin to support the new EditableImage workflow changes: [Studio Beta] Major updates to in-experience Mesh & Image APIs

  • Performance improvements and memory optimisations for CanvasDraw.GetImageData() and CanvasDraw.GetImageDataFromTextureId()

  • The CanvasDraw.GetImageDataFromTextureId() method has been updated to support any asset based errors as this method can no longer guarantee a returned ImageData due to new EditableImage API changes and limiations. This method will also no longer work on assets that you do not own.


New SaveObject Format - Resolution Increased

CanvasDraw SaveObjects have a new chunk-based format which has allowed me to increase the resolution limit from 256x256 to 1024x1024 pixels!

The CanvasDraw Tools plugin has also been updated to support this new limit and format


PLEASE NOTE:

1024x1024 is a very large image to compress and decompress. In most use cases, you don’t even need anything higher than 512x512.

At a resolution this high;

  • Importing SaveObjects may freeze your client for a few seconds.

  • Storing a lot of these large SaveObjects may impact your place file size.

  • Calling CanvasDraw.GetImageData(SaveObject) will normally freeze your client for a second second. A new parameter has been added to this method (SlowLoad) which avoids this problem.
    Setting this parameter to true will yield your code and slowly decompress large SaveObjects to avoid freezing the client.

  • For an alternative, you can also use roblox images and call CanvasDraw.GetImageDataFromTextureId(TextureId) instead, which avoids decompression and doesn’t take up storage space.


Here’s the full change log:

Module Changes:

  • Increased SaveObject resolution read limit from 256x256 to 1024x1024

  • Added Canvas:GetBuffer() and Canvas:SetBuffer()

  • Added SlowLoad parameter to CanvasDraw.GetImageData()

  • Fixed module and plugin to support the new EditableImage workflow changes

  • Performance improvements and memory optimisations for CanvasDraw.GetImageData() and CanvasDraw.GetImageDataFromTextureId()

Plugin Changes:

  • Increased the SaveObject Importer resolution limit from 256x256 to 1024x1024

  • Increased the Image Editor resolution limit from 256x256 to 1024x1024


CanvasDraw4.9.0.b.rbxm (65.7 KB)

2 Likes

mine keeps returning Unable to create an Instance of type "EditableImage"

Are you using the latest version? All previous 4.0 versions will no longer work due to a change to EditableImage

I use canvasdraw version v4.9.0.b

Hmm odd… I’ll take a look today

Can you please provide a screenshot of the error? thanks!