note 6222 modified in function.imagefilledrectangle by irc-html
| From: | irc-html@php.net | Date: | Wed, 16 Jan 2002 17:04:29 +0000 |
| Subject: | note 6222 modified in function.imagefilledrectangle by irc-html | ||
| References: | 1 | Groups: | php.notes |
| Request: | Send a blank email to php-notes+get-24929@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"
/>
--was--
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/en/function.imagefilledrectangle.php