note 6222 modified in ImageFilledRectangle by ronabop
| From: | ronabop@php.net | Date: | Wed, 04 Oct 2000 15:04:14 +0000 |
| Subject: | note 6222 modified in ImageFilledRectangle by ronabop | ||
| Groups: | php.notes | ||
| Request: | Send a blank email to php-notes+get-6038@lists.php.net to get a copy of this message | ||
The following example creates a clickable color and gray palettes.
Note: you must have a pngs directory at the document root level.
<script language="JavaScript">
var coRed=127;coGreen=127;coBlue=255; // Original color
var Hex=new
Array("0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F");
function rgb2hex(cRed,cGreen,cBlue){
cColor=Hex[Math.floor(cRed/16)]+Hex[cRed%16]+Hex[Math.floor(cGreen/16)]+Hex[cGreen%16]+Hex[Math.floor(cBlue/16)]+Hex[cBlue%16];
return cColor;
}
function ShowColor(cColor){
with (document){
// Do whatever you have to do here
}
};
function plttClick(cRed,cGreen,cBlue){
// Change the color
coRed=cRed;
coGreen=cGreen;
coBlue=cBlue;
// Replace the following line with your own code
alert(cRed+','+cGreen+','+cBlue)
}
function plttOver(cRed,cGreen,cBlue){
ShowColor(rgb2hex(cRed,cGreen,cBlue));
// Add you own code here
self.status='Red: '+cRed+' / Green: '+cGreen+' / Blue: '+cBlue;
}
function plttOut(){
// Restore original color
ShowColor(rgb2hex(coRed,coGreen,coBlue));
// Add you own code here
self.status='Click on the color of your choice';
}
</script>
<?php
// -- Color Palette -
$arColors[]=0; // 0x00
$arColors[]=51; // 0x33
$arColors[]=102; // 0x66
$arColors[]=153; // 0x99
$arColors[]=204; // 0xCC
$arColors[]=255; // 0xFF
$plttSize=Count($arColors);
$cellWidth=12;
$pic=ImageCreate($plttSize*$plttSize*($cellWidth+1),$plttSize*($cellWidth+1));
ImageFilledRectangle($pic,0,0,$plttSize*$plttSize*($cellWidth+1),$plttSize*($cellWidth+1),ImageColorAllocate($pic,255,255,255));
$cTop=0;
print("<map name=\"color-pltt\">\n");
for($cRed=0;$cRed<$plttSize;$cRed++){
$cLeft=0;
for($cGreen=0;$cGreen<$plttSize;$cGreen++){
for($cBlue=0;$cBlue<$plttSize;$cBlue++){
ImageFilledRectangle($pic,$cLeft,$cTop,$cLeft+$cellWidth-1,$cTop+$cellWidth-1,ImageColorAllocate($pic,$arColors[$cRed],$arColors[$cGreen],$arColors[$cBlue]));
print("<area shape=\"rect\"
coords=\"".$cLeft.",".$cTop.",".($cLeft+$cellWidth-1).",".($cTop+$cellWidth-1)."\"
href=\"javascript:plttClick(".$arColors[$cRed].",".$arColors[$cGreen].",".$arColors[$cBlue].")\"
onMouseOver=\"plttOver(".$arColors[$cRed].",".$arColors[$cGreen].",".$arColors[$cBlue].");return
true;\" onMouseOut=\"plttOut();return true;\" />\n");
$cLeft=$cLeft+$cellWidth+1;
}
}
$cTop=$cTop+$cellWidth+1;
}
print("</map>\n");
ImagePNG($pic,"./pngs/color-pltt.png");
ImageDestroy($pic);
// -- Gray Palette -
$plttSize=32; // Must be a divider of 256
$cellWidth=12; // Must be >0
$pic=ImageCreate(($plttSize+1)*($cellWidth+1),$cellWidth+1);
ImageFilledRectangle($pic,0,0,$plttSize*($cellWidth+1),$cellWidth+1,ImageColorAllocate($pic,255,255,255));
$incRGB=floor(256/$plttSize);
$cLeft=0;
$cTop=0;
print("<map name=\"gray-pltt\">\n");
for($cGray=0;$cGray<($plttSize+1);$cGray++){
if($cGray==0){
$grayRGB=0;
} else {
$grayRGB=($cGray*$incRGB)-1;
}
ImageFilledRectangle($pic,$cLeft,$cTop,$cLeft+$cellWidth-1,$cTop+$cellWidth-1,ImageColorAllocate($pic,$grayRGB,$grayRGB,$grayRGB));
print("<area shape=\"rect\"
coords=\"".$cLeft.",".$cTop.",".($cLeft+$cellWidth-1).",".($cTop+$cellWidth-1)."\"
href=\"javascript:plttClick(".$grayRGB.",".$grayRGB.",".$grayRGB.")\"
onMouseOver=\"plttOver(".$grayRGB.",".$grayRGB.",".$grayRGB.");return
true;\" onMouseOut=\"plttOut();return true;\" />\n");
$cLeft=$cLeft+$cellWidth+1;
}
print("</map>\n");
ImagePNG($pic,"./pngs/gray-pltt.png");
ImageDestroy($pic);
?>
<p>Color Palette</p>
<img src="./pngs/color-pltt.png" usemap="#color-pltt" border="0"
/>
<p>Gray Palette</p>
<img src="./pngs/gray-pltt.png" usemap="#gray-pltt" border="0"
/>
http://www.php.net/manual/function.imagefilledrectangle.php