Pixel Drawing Algorithm

Question

I need an example algorithm that will draw pixels one at a time on a grid based (x,y) system, and also color them based on an rbg value based on binary data that is provided in some form. I am looking for anything written in php or a php like language such as C, but that does not use any sort of library or graphics card api, as i am coding in php.

Here is something that i wrote in php, that uses random color values but it takes 15 seconds to render in an html canvas:

<?php
$r_max = 240;
$c_max = 320;
$row = -1;//-1 to offset while
while ($row<$r_max){
    ++$row;
    for($column=0; $column<=$c_max; ++$column)
    {
    echo 'ctx.fillStyle = "rgb(', rand()%255, ',', rand()%255, ',', rand()%255, ')";';
    echo 'ctx.fillRect(', $column, ',', $row, ',1,1);';
    }
}
?>

Answer 1

Not really sure i quite understand your question but .. PHP has GD functions that include image allocate and setpixel calls, line drawing etc .. check here

oh and yes imagemagick also for more exotic uses

Answer 2

It seem you are trying to output JavaScript commands for drawing on a <canvas> tag. A faster way to draw the pixels might be to use moveTo and lineTo. Btw, why isn't you outer loop a for loop as well?

Doesn't

for($row=0; $row<=$r_max; ++$row) {
    for($column=0; $column<=$c_max; ++$column) {
        # draw pixel
    }
}

seem more natural?

Answer 3

The issue is that you're generating code for each pixel. Instead, why not have the code write the pixel info to your favorite image format, then display that in the page? That's the most reasonable (to me) algorithmic solution... I'm not sure if it'll fit into what you're trying to do.

Answer 4

I cant use an image format, because it is not efficiant for my usage. I am looking for some example code where an image might be displayed based on data, just so I can get an idea of hhow to do what I am doing at a rate faster that 15 seconds per render. The nested loops I included above are way to slow.