Discussion :

[sebastiez]

Bonjour,
Je souhaiterai connaître la ou les couleurs dominantes d'une image en javascript (ou autre si vous avez mieux à me proposer).

Pour ce faire j'ai retenu un script qui devrait répondre à ma demande mais comme je touche un peu en HTML/PHP/CSS et que je suis une grosse M.. en JS ( pas de commentaire), je n'arrive pas à le faire fonctionner.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
65
66
67
68
69
70
71
72
73
74
 
<script type="text/javascript">
function colorPalette($imgname) 
{ 
    $im = imagecreatefromjpeg($imgname); 
    $width = imagesx($im); 
    $height = imagesy($im); 
 
    $palette = array(); 
    for ($j = 0;$j < $height;$j++) { 
        for ($i = 0;$i < $width;$i++) { 
            $color = imagecolorat($im, $i, $j); 
            $r = ($color >> 16) &0xFF; 
            $g = ($color >> 8) &0xFF; 
            $b = $color &0xFF; 
 
            $rgbtohex = dechex($color); 
            $websafe = hex2websafe($rgbtohex); 
 
            if (array_key_exists($websafe, $palette)) { 
                $palette[$websafe]++; 
            } else { 
                $palette[$websafe] = 1; 
            } 
        } 
    } 
    arsort($palette); 
    imagedestroy($im); 
    return $palette; 
} 
 
function hex2websafe($hex) 
{ 
 
    // websafe color : only "00", "33", "66", "99", "CC" or "FF" 
    $step= 51; 
    $result = ""; 
 
    $rgb['r'] = hexdec(substr($hex, 0, 2)); 
    $rgb['g'] = hexdec(substr($hex, 2, 2)); 
    $rgb['b'] = hexdec(substr($hex, 4, 2)); 
    foreach($rgb as $color) { 
        $websafe = $step * round($color / $step); 
        $result .= str_pad(dechex($websafe), 2, '0', STR_PAD_LEFT); 
    } 
    return $result; 
} 
 
function limitedPalette($palette, $length) 
{ 
    $n = 0; 
    $result = array(); 
    foreach ($palette as $key => $values) { 
        $result[$key] = $values; 
        $n++; 
        if ($n >= $length) break; 
    } 
    return $result; 
} 
</script>
 
<?php
$filename = "AlmaTadema_Godspeed.jpg"; 
//On chope toutes les couleurs de l'image 
$allColors = "<script language='Javascript'>colorPalette(".$filename.");</script>";
//on prend seulement les 8 premières couleurs 
$limitedColors = "<script language='Javascript'>limitedPalette(".$allColors.", 8);</script>";
//on affiche les 8 couleurs dominantes de l'image 
 
echo "<p><img src=".$filename." /></p>"; 
foreach ($limitedColors as $color => $infos) { 
     echo "<div style='background-color:#".$color.";width:100px;height:100px;'>#".$color."</div>"; 
} 
?>

source : http://blog.vanilla-dev.net et vu également sur http://www.developpez.net.

J'aurai par la suite d'autre sollicitation concernant ce code sans vouloir abuser de votre générosité mais procédons par étape.

Etape : FAIRE FONCTIONNER LE SCRIPT

[SpaceFrog]

ha une belle confusion entre javascript et php ...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

imagecreatefromjpeg($imgname);

ça c'est php et gdlib ... rein à voir avec javascript

j'ai bien peur que javascript ne puisse pas grand chose pour toi. Enfin pas tout seul.

il te faudra passer les coordonnées du point voulu au serveur et recupérer la couleur sur le serveur

[Bovino]

source : http://blog.vanilla-dev.net

Dont le titre est "Couleurs dominantes d'une image en php"

[sebastiez]

Honte à moi !!!

Je ne connaissais pas le GDlib, donc forcement j'étais dans l'erreur depuis le début. Heureusement que le GDlib est activé sur mon serveur. J'ai viré tout le JS pour revenir en PHP et ... ça fonctionne.

Merci de m'avoir remis sur le bon chemin.

Pour la seconde étape, je vais donc solliciter l'aide de vos voisins du forum PHP