Re: Pixel graphics and performance

Sun, 07 Sep 2014 09:48:47 +0000

Everything that's drawn in Kojo goes into a scene graph. This is really inefficient for pixel graphics, so there is indeed a recommended way to do performant pixel graphics. The basic idea is that you create a raw image:

val img = image(200, 200)

And then set the individual pixels in the image.

for (x <- 0 until 200; y <- 0 until 200) { val clr = Color(r.get(x, y), g.get(x, y), b.get(x, y)) setImagePixel(img, x, y, clr) }

Once your image is ready, you need to ask Kojo to draw it (i.e. put it into the scene graph). There are two ways to do this. The first is via the Turtle API:

setCostumeImage(img) // or create a new turtle with the image as its costume

The second is via Pictures (Kojo's functional graphics API)

val pic = PicShape.image(img) draw(pic)

Raw images are unfortunately not supported in the Staging API (which has not seen any enhacements for the past couple of years).

Here's your code, reworked to work with raw images and the Turtle/Pictures APIs:

class ColorGen { var map = Array.ofDim[Int](200, 200) map(0)(0) = random(256) for (i <- 1 until 200) { map(i)(0) = if (random(5) == 0) random(256) else map(i - 1)(0) map(0)(i) = if (random(5) == 0) random(256) else map(0)(i - 1) } def get(i: Int, j: Int): Int = { if (map(i)(j) == 0) { val d = random(3) + 1 map(i)(j) = if (random(1000) == 0) random(256) else { get((200 + i - (d & 1)) % 200, (200 + j - (d >> 1)) % 200) } } map(i)(j) } } val r = new ColorGen val g = new ColorGen val b = new ColorGen val img = image(200, 200) for (x <- 0 until 200; y <- 0 until 200) { val clr = Color(r.get(x, y), g.get(x, y), b.get(x, y)) setImagePixel(img, x, y, clr) } // draw image via Turtle api //clear() //setCostumeImage(img) // draw image via Pictures api cleari() setBackground(black) val pic = PicShape.image(img) draw(pic)

Edit. call setBackground() after clear() in the reworked code to make it have an effect.

Pixel graphics and performance

Sun, 07 Sep 2014 07:49:29 +0000

I've been evaluating Kojo for the purposes of introducing my kids to programming. Yesterday I tried to rewrite this example from the Tweetable Mathematical Art contest on codegolf.stackexchange.com. It works, but is extremely slow - painting a 200x200 square takes over 20 seconds. (I had to paint dot-by-dot because I could not figure out if there is a pixel graphics API - if there is, a pointer would be appreciated.)

import Staging._ import Staging.{screenSize, dot} reset screenSize(200, 200) println(screenWidth) background(black) class ColorGen { var map = Array.ofDim[Int](200, 200) map(0)(0) = random(256) for (i <- 1 until 200) { map(i)(0) = if (random(5) == 0) random(256) else map(i-1)(0) map(0)(i) = if (random(5) == 0) random(256) else map(0)(i-1) } def get(i: Int, j: Int): Int = { if (map(i)(j) == 0) { val d = random(3) + 1 map(i)(j) = if (random(1000) == 0) random(256) else {get((200+i-(d&1)) % 200, (200+j-(d >> 1)) % 200)} } map(i)(j) } } val r = new ColorGen val g = new ColorGen val b = new ColorGen for (x <- 0 until 200; y <- 0 until 200) { stroke(color(r.get(x,y), g.get(x,y), b.get(x,y))) dot(x, y) } println("DONE")

I then did the same sample in Processing and found it capable of repainting a 200x200 square over thirty times per second.

Does this happen because Kojo is inherently slower, or because it is not suitable for pixel graphics?