img2table

Gepost door Christophe Vroonen op 10-01-2009 11:28.

Dankzij de vriendelijke heren & dames in het forum heb ik dit script kunnen maken. Het converteert een afbeelding naar een table. Het resultaat is GIGANTISCH groot, maar het is handig voor diegenen die het willen gebruiken. Ik heb ook een werkend voorbeeld gezet op http://files.khh.be/generator.php .

Vragen mogen altijd hier gepost worden of gestuurd door op mijn naam te klikken

Bestanden van dit script

index.php

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<html>
    <head>
        <title>
            Image to table converter
        </title>
    </head>
<body>
<h2 align="center">Script gemaakt door <a href="mailto:christophe.vroonen@gmail.com">Christophe Vroonen</a></h2>
<br />
<br />
<center>
<form name="converter" action="generator.php" method="post">
File url: <input type="text" name="x" size="50"/><br />
<input type="submit" name="submit" value="Submit">
</form>
</center>
<p align="center">Watch out - file size will be big!</p>
<?php
if (isset($_POST['x']))
{
    echo("<br /><br /><br /><br />");
    $extension = end(explode(".", $_POST['x']));
    $extension = strtoupper($extension);
    switch ($extension)
    {
        case 'PNG':
            $im = imagecreatefrompng($_POST['x']);
            break;
        case 'JPG':
        case 'JPEG':
            $im = imagecreatefromjpeg($_POST['x']);
            break;
        case 'GIF':
            $im = imagecreatefromgif($_POST['x']);
            break;
        case 'BMP':
            $im = imagecreatefrombmp($_POST['x']);
            break;
    }
    $width = imagesx($im);
    $height = imagesy($im);
    echo("<table cellspacing='0' cellpadding='0'>");
    for($i = 0; $i < $height; $i++)
    {
        echo("<tr>\n");
        for ($j = 0; $j < $width; $j++)
        {
            $rgb = imagecolorat($im, $j, $i);
            $r = ($rgb >> 16) & 0xFF;
            $g = ($rgb >> 8) & 0xFF;
            $b = $rgb & 0xFF;
            $hex = "#";
            $hex.=dechex($r);
            $hex.=dechex($g);
            $hex.=dechex($b);
            echo("<td style='width:1px;height:1px;background-color:".$hex."'></td>");
        }
        echo("</tr>");
    }
    echo("</table>");
}
?>
</body>
</html>

Commentaar

10-01-2009 17:28

Vermeld hier alle zaken betreffende valkuilen, handige informatie, (installatie-)instructies e.d.

1
2
3
4
5
6
7
8
9
- Echo is een language construct, daar horen dus geen haakjes ( ) omheen.
- imagecreatefrombmp bestaat niet
- Geen error checking om te kijken of er überhaupt wel een plaatje is: als ik Peter.php upload zal $im undefined zijn, en krijg je een hele berg warnings.
- HTML attributen moeten hun waarde via dubbele quotes toegekend krijgen, niet via enkele.
- Een hexwaarde geretourneerd via dechex kan ook één teken hebben ipv. 2 (11 wordt B), waardoor de "pixel" een andere kleur krijgt dan in het origineel. Pad dit met sprintf:

sprintf ('#%02X%02X%02X', $nRood, $nGroen, $nBlauw);

- De code kan heel véél kleiner, maak een algemene stylesheet aan waarin je voordefinieerd dat alle <td> elementen een hoogte en breedte van één pixel hebben.
10-01-2009 17:45

>>>><?php
case 'BMP':
$im = imagecreatefrombmp($_POST['x']);
break;
?><<<<
Mij kent geen imagecreatefrombmp, laat staan een functie die BMP in kan lezen. Behalve dan de homebrew-functies dan. Maar dat is niet standaard meegeleverd en dus ook niet handig om in zo'n script te zetten.

>>>>
Het resultaat is GIGANTISCH groot, maar het is handig voor diegenen die het willen gebruiken.
<<<<
Ja, en niet een beetje gigantisch ook. Noem dat maar gewoon gigaGIGANTISCH en niet goed voor uw bandbreedte. Misschien had je het beter als className kunnen doen?
Het was zelfs beter als je het gewoon als grote JS te doen:

Bijv zo:
<?php # voor kleurtjes
<script type="text/javascript">
function parseImage(){
var table = document.body.appendChild(new Element('table', {cellpadding: 0, cellspacing: 0});
var trow;
var width = 100;
var colors = [0, 16777215, 255, ....., 16711680, 65280]; // matrix van 100 x N, in dit voorbeeld: zwart, wit, blauw, ...., rood, groen.
var counter = 0;
while(counter < colors.length){
if((counter % width) == 0) trow = table.appendChild(new Element('tr'));
var col = colors[counter];
trow.appendChild(new Element('td')).setStyle({width: '1px', height: '1px', backgroundColor: ('rgb(' + (col >>18) + ', ' + ((col >> 8) & 0xFF) + ', ' + (col & 0xFF) + ')')});
++counter;
}
}
</script>
?>

Ik denk dat ik met deze code wel de weddenschap aan kan gaan dat deze sneller is. Je moet alleen de array `colors` eventjes netjes invullen.
Kan met deze waarden: (imagecolorat($im, $j, $i) & 0xFFFFFF)

Daarnaast klopt je script op dat punt ook gewoon niet:
>>>>
$rgb = imagecolorat($im, $j, $i);
$r = ($rgb >> 16) & 0xFF;
$g = ($rgb >> 8) & 0xFF;
$b = $rgb & 0xFF;
$hex = "#";
$hex.=dechex($r);
$hex.=dechex($g);
$hex.=dechex($b);
<<<<
Stel dat op pixel $j, $i de kleurwaarde overeenkomt met rgb(15, 15, 15);
Jouw script produceert dan iets als: #fff. Dat komt neer op wit. Terwijl het in werkelijkheid ongeveer het donkerste grijs is wat je je kunt voorstellen.
Of bij rgb(255, 255, 0): #ffff0 --> fout in FF (verwacht ik) en wordt waarschijnlijk een blauwgroenig kleurtje in IE.

Persoonlijk vind ik dit verder niet echt een script voor in de SL.
- Het is niet algemeen bruikbaar, dan had je er iets van een class van moeten maken o.i.d., het is meer een snippet dan een script. En gezien het scriptlibrary en geen snippetlibrary heet...
- Hoe vaak zul je zoiets nodig hebben? Het is veel te kostbaar om op deze manier met je resources om te gaan, waarom zou je online een tabel met een plaatje willen tonen in plaats van een afbeelding? Copyright is ook geen reden, daar hebben we printscreen voor.

1
2
3
Post hier de source-code van je script. Alle informatie tussen <? ... ?> en <?php ... ?> zal automatisch worden getoond in color-coding. 

Let op! Het is niet de bedoeling om hier een link naar je website te plaatsen. Post hier gewoon de code, veel simpeler, sneller en meer kans dat het blijft staan.
10-01-2009 20:10

Hij werkt ook niet 100 % precies.
Voer deze eens in:
http://www.phpfreakz.nl/img/php.top.08.nb.jpg

;)

1
2
3
Post hier de source-code van je script. Alle informatie tussen <? ... ?> en <?php ... ?> zal automatisch worden getoond in color-coding. 

Let op! Het is niet de bedoeling om hier een link naar je website te plaatsen. Post hier gewoon de code, veel simpeler, sneller en meer kans dat het blijft staan.
11-01-2009 00:26

En dan een positieve revisie, ik vind het leuk bedacht! :)

Misschien iets minder positief, maar wel reëel, het is niet echt praktisch en/of bruikbaar door onder andere de snelheid. :(

1
2
3
<?php 
# :O :O :O
?>
12-01-2009 11:14

Het script legt je hele hosting down als je beetje een grote afbeelding doet uploaden.

Niet echt functioneel denk ik

1
2
3
Post hier de source-code van je script. Alle informatie tussen <? ... ?> en <?php ... ?> zal automatisch worden getoond in color-coding. 

Let op! Het is niet de bedoeling om hier een link naar je website te plaatsen. Post hier gewoon de code, veel simpeler, sneller en meer kans dat het blijft staan.
13-01-2009 19:20

Vermeld hier alle zaken betreffende valkuilen, handige informatie, (installatie-)instructies e.d.

1
2
3
4
5
6
7
8
9
10
11
<?
            $hex = "#";
            $hex.=dechex($r);
            $hex.=dechex($g);
            $hex.=dechex($b); 
?>
->
<?
            $hex = "#";
            $hex.= ($r << 16) | ($g << 8) | $b; 
?>
Inloggen wachtwoord vergeten? Aanmelden