Mysterious grid overlay when using contour filters in ORX

1

When I use CannyEdgeDetector, LumaSobel, and LumaLaplacian (as well as CMYKHalftone), I see a strange grid overlay on my image when it is rendered to screen. I’m pasting my code here and a picture of what I see.

import org.openrndr.application
import org.openrndr.color.ColorRGBa
import org.openrndr.draw.isolatedWithTarget
import org.openrndr.draw.renderTarget
import org.openrndr.extra.fx.edges.CannyEdgeDetector
import org.openrndr.extra.fx.edges.LumaSobel
import org.openrndr.extra.fx.edges.LumaLaplacian
import org.openrndr.ffmpeg.VideoPlayerConfiguration
import org.openrndr.ffmpeg.VideoPlayerFFMPEG
import org.openrndr.shape.Rectangle

fun main() = application {
    configure {
        width = 720
        height = 720
        windowResizable = true
    }
    program {
        val config = VideoPlayerConfiguration()
        config.displayQueueSize = 50
        config.synchronizeToClock = false
        val camera = VideoPlayerFFMPEG.fromDevice(configuration = config, audioDevice = null, deviceName = "/dev/video0")
        camera.play()
        val source = Rectangle(camera.width.toDouble() / 2.0  - camera.height.toDouble() / 2.0, 0.0, camera.height.toDouble(), camera.height.toDouble())
        var rtDestination = Rectangle(0.0, 0.0, window.size.y, window.size.y)

        var rt = renderTarget(window.size.x.toInt(), window.size.y.toInt()) {
            colorBuffer()
        }

        window.sized.listen {
            rt = renderTarget(window.size.x.toInt(), window.size.y.toInt()) {
                colorBuffer()
            }
            rtDestination = Rectangle(0.0, 0.0, window.size.y, window.size.y)
        }

        val effect = LumaSobel()
        extend {
            drawer.clear(ColorRGBa.BLACK)
            drawer.isolatedWithTarget(rt) {
                camera.draw(drawer, source, rtDestination)
            }
            effect.apply(rt.colorBuffer(0), rt.colorBuffer(0))
            val dim = window.size.y * 0.9
            val destination = Rectangle(window.size.y / 20.0, window.size.x / 20.0, dim, dim)
            drawer.image(rt.colorBuffer(0), rtDestination, destination)
        }
    }
}

image
image732×768 143 KB

2

Hi! :slight_smile: I gave it a try and it seems like the issue appears when applying the LumaSobel effect from a color buffer to the same color buffer. There are multiple effects that do not work well when the source and the target is the same. The solution is to create an additional target ColorBuffer and write the result into it.

Another tip: call rt.destroy() before creating a new render target to avoid memory leaks (same applies when assigning a new ColorBuffer to a var).

1 Like
3

thanks, that fixes it! Also good to know about the render target memory leak.