shader that leaves trails behind objects like like lightworld does

[DarkShroom]

Hi forum

I am looking for a shader that leaves a trail behind the objects like lightworld does when the RGB value are set high. It'll leave a little blurry trail behind the objects therefore.

I would use lightworld but I find it a bit bloated and want to use either moonshine or my own shaders.

I am trying to dig through lightworld to find which shader does this, can anyone point me in the right direction of which sort of shader i need for this?

I figure that perhaps, since information is left from previous frames, the shader is not going to be the usual sort of one? Is there a different name at all also for a shader that has information left from previous frames?

I am completely new to shaders, so forgive my ignorance, thanks


EDIT: this is through the lightworld shader, i love the way you can make the electricity look very half-life:




EDIT: I just refactored the smoke shader from the beginners guide to shaders, i heard it mentioned that these are "self-propagating shaders"

[grump]

It's hard to say from your description what you actually want. Do you want to achieve a fullscreen motion blur effect? For a really simple version of the effect, you don't even need a shader a shader: Do not clear the screen at the start of a new frame, just draw a black translucent fullscreen rectangle at the start of the frame instead. Draw your scene on top of that. The alpha value of the rectangle controls the length of the "trails".

[DarkShroom]

It's hard to say from your description what you actually want...

Hi thanks, something like you describe, thanks as this lead me to "random walker" (https://love2d.org/forums/viewtopic.php?t=81204)

Code: Select all

width = love.graphics.getWidth()
height = love.graphics.getHeight()

function draw_my_rect()

    offsetX = 100 * math.sin(time) + 100
    offsetY = 100 * math.sin(time/2) + 100

    rect_width = 50
    rect_height = 50

    colorPos = math.sin(time) * 255

    love.graphics.setColor(255, colorPos,-colorPos)
    love.graphics.rectangle('fill', offsetX, offsetY, rect_width, rect_height)

    love.graphics.setColor(0, 0,0)
    love.graphics.rectangle('fill', offsetX + rect_width/4, offsetY + rect_height/4, rect_width/2, rect_height/2)


end



function love.load()
    love.graphics.clear = function() end --stop clearing of frame
end


function love.update()
    time = love.timer.getTime()
end




function love.draw()

    draw_my_rect()

    love.graphics.setColor(0,0,0,10)
    love.graphics.rectangle('fill', 0,0,width,height)

end

Well this is a start (and useable thanks), but it will not blur the inside of the thing drawn... so the black bit in my example will not leave a trail as the other bit overdraws

cool though, reminds me of a windows screensaver


still the question remains, how does lightworld achieve that actual blur, it would leave trails of things behind that where in the centre of that rectangle... it must be some shader voodoo. Anyway, i think I might now be on the right track and able to implement a simple outside motion blur, this is still cool

[grump]

Code: Select all

width = love.graphics.getWidth()
height = love.graphics.getHeight()

function draw_my_rect()

    offsetX = 100 * math.sin(time) + 100
    offsetY = 100 * math.sin(time/2) + 100

    rect_width = 50
    rect_height = 50

    colorPos = math.sin(time) * 255

    love.graphics.setColor(255, colorPos,-colorPos)
    love.graphics.rectangle('fill', offsetX, offsetY, rect_width, rect_height)

    love.graphics.setColor(0, 0,0)
    love.graphics.rectangle('fill', offsetX + rect_width/4, offsetY + rect_height/4, rect_width/2, rect_height/2)


end



function love.load()
	scene = love.graphics.newCanvas()
	blur = love.graphics.newCanvas()
end


function love.update()
    time = love.timer.getTime()
end




function love.draw()

    scene:renderTo(function()
		love.graphics.clear(0, 0, 0, 255)
    	draw_my_rect()
    	love.graphics.setColor(255, 255, 255, 250)
    	love.graphics.setBlendMode("add")
    	love.graphics.draw(blur)
    	love.graphics.setBlendMode("alpha")
    end)

    blur:renderTo(function()
    	love.graphics.setColor(255, 255, 255, 255)
    	love.graphics.draw(scene)
    end)

    love.graphics.setColor(255, 255, 255, 255)
    love.graphics.draw(scene)
end

[DarkShroom]

thanks grump that looks cool

[DarkShroom]

thanks for this info

so i have utilised this strategy for some blurring and am looking into possibly more advanced methods

can I ask, is there a way to draw this blur we have using the canvas, but having a non blurring background? So like a background image? With this canvas method, I find that I can only have a black background.

[SirRanjid]

I've just come to a similar problem here's my try on it:

First create some canvases in an array (i just used 10)

Code: Select all

local tcvs = {}
local tcvsp = 1	--moving array index
for I = 1 , 10 do
	tcvs[I] = love.graphics.newCanvas( )
end

Then in the draw functionI do something like this (the functions lack love.graphics.<func> because they're local for performance reasons (clear,setcolor,setcanvas,draw)):

Code: Select all

setCanvas(tcvs[tcvsp])	--#trail
	--here the stuff to draw for the trail
setCanvas()

for I = 0 , 9 do	--starts from 0 to 9 instead 1 to 10
	modcol(rcw,1,0.1+0.1*I)
	draw(tcvs[(tcvsp+I)%10+1])
end

tcvsp = tcvsp+1
if tcvsp > 10 then tcvsp = 1 end

The modcol function:

Code: Select all

local function modcol(col,c,a)
	setcolor(col[1]*c,col[2]*c,col[3]*c,col[4]*a)
end

Looks like this for solid objects:


And for translucent like this(not that visible in the retro skin):


Problem is it works only for a static scene with moving objects. Need to figure out how to adjust the canvases for a moving field.


EDIT:
Reduced the amount to 3(where 1 is the original) and added an exponential falloff to the alpha which looks much nicer:

Code: Select all

for I = 0 , 2 do
	modcol(rcw,1,((I+1)/3)^2)
	draw(tcvs[(tcvsp+I)%3+1])
end

[DarkShroom]

well i'm still on it but i was not too concerned at the moment for a moving camera, i figure that'll leave a heady blur

i imagine a decision needs to be made if you want the canvas to be larger than the scene, or maybe just sorta attach the blur to the camera so loosing blurs at the sides of the screen or something (i figure you'd need to render to a blur and scene canvas bigger than the screen)

anyways for me, i just want to figure having a background image first, i'll get there


with your one, i figure you could fake a blur by knowing those previous positions the snake things have been to