Page 1 of 1

[SOLVED] Weird graphical bug with canvas

Posted: Wed Aug 18, 2021 1:46 pm
by XHH
Hi, I'm trying to draw a grid using the canvas and graphics methods. For some reason it is sometimes showing a gradient in the background. This doesn't happen if I draw without using a canvas though. Am I using canvas incorrectly? (screenshot and code below)
Screenshot from 2021-08-18 09-26-18.png
Screenshot from 2021-08-18 09-26-18.png (14.03 KiB) Viewed 6213 times

Code: Select all

local canvas 
local snap = {x=32, y=32}

love.load = function()
  width, height = love.graphics.getWidth(), love.graphics.getHeight()
  canvas = love.graphics.newCanvas()

  canvas:renderTo(function()
    love.graphics.clear()
    love.graphics.setColor(224/255, 224/255, 224/255, 0.5)
    local linex, liney = 0, 0
    -- v lines
    for x = 0, width do 
      linex = x * snap.x 
      love.graphics.line(linex, 0, linex, height)
    end
    -- h lines
    for y = 0, width do 
      liney = y * snap.y 
      love.graphics.line(0, liney, width, liney)
    end
    -- origin
    love.graphics.setColor(224/255, 224/255, 224/255, 1)
    love.graphics.line(0,0,width,0)
    love.graphics.line(0,0,0,height)
  end)
end

love.draw = function()
  love.graphics.draw(canvas)
end
Specs:
Running love-11.3-x86_64.AppImage
-- on --
Pop!_OS 21.04 64 bit
AMD Ryzen 7 2700 8 core
Radeon RX 580

Re: Weird graphical bug with canvas

Posted: Wed Aug 18, 2021 2:04 pm
by milon
I didn't check over your code, but it runs just fine for me (Linux Mint with the most recent nvidia driver). See screenshot.
I suspect you've got a driver issue.
EDIT - Note how the lines in my screenshot are additive - they're brighter where they cross. That's because you're drawing the lines with some transparency, so I believe my screenshot is correct in that matter too.

Re: Weird graphical bug with canvas

Posted: Wed Aug 18, 2021 3:28 pm
by BrotSagtMist
I can neither reproduce the gradient but i can confirm it renders different here too.

My guess is: youre not reverting the last color change in line 22. Youre effectively adding color tint to the canvas. That may be broken at your driver.

Re: Weird graphical bug with canvas

Posted: Wed Aug 18, 2021 7:00 pm
by darkfrei
Always set the color to white before draw the canvas.

Also do

Code: Select all

    for x = 0, width/snap.x do -- don't render to out of canvas
      linex = x * snap.x 
      love.graphics.line(linex, 0, linex, height)
    end

[SOLVED] Re: Weird graphical bug with canvas

Posted: Wed Aug 18, 2021 8:51 pm
by XHH
darkfrei wrote: Wed Aug 18, 2021 7:00 pm Always set the color to white before draw the canvas.

Also do

Code: Select all

    for x = 0, width/snap.x do -- don't render to out of canvas
      linex = x * snap.x 
      love.graphics.line(linex, 0, linex, height)
    end
It looks like rendering outside of the canvas was the issue! Also setting the color to white solved another issue. Thank you so much :D