Applying a mask

[Stretchwickster]

I have some small, simple 2-colour bitmaps for which I need to change the outline colour depending on the value of a variable before drawing the image. The images currently have a black outline colour and white fill.

For example, if var1="red" then display the image with a red (rather than original black) outline. I think this is called applying a mask/filter.

I have managed to achieve this using CSS filters but these only work in IE.

<img src="Grid.bmp" style="width='100%';Filter: Invert Chroma(Color = #000000) Mask(Color=#FF0000)"  />

I would like to write a PHP script which standardises the output in all browsers. So far, I have managed to invert the image (see below) using GD but haven't worked out how to apply a coloured mask.

unction invert_image($input,$output,$color=false,$type='jpeg')
{
	if($type == 'jpeg') $bild = imagecreatefromjpeg($input);
	else $bild = imagecreatefrompng($input);

	$x = imagesx($bild);
	$y = imagesy($bild);

	for($i=0; $i<$y; $i++)
	{
		for($j=0; $j<$x; $j++)
		{
			$pos = imagecolorat($bild, $j, $i);
			$f = imagecolorsforindex($bild, $pos);
			if($color == true)
			{
				$col = imagecolorresolve($bild, 255-$f['red'], 255-$f['green'], 255-$f['blue']);
			}else{
				$gst = $f['red']*0.15 + $f['green']*0.5 + $f['blue']*0.35;
				$col = imagecolorclosesthwb($bild, 255-$gst, 255-$gst, 255-$gst);
			}
			imagesetpixel($bild, $j, $i, $col);
		}
	}
	if(empty($output)) header('Content-type: image/'.$type);
	if($type == 'jpeg') imagejpeg($bild,$output,90);
	else imagepng($bild,$output);
}

$input = '[URL unfurl="true"]http://www.eatxp.34sp.com/images/Grid.jpg';[/URL]

// for a black and withe negative image use like this
invert_image($input,'');
?>

Source:

http://www.phparadise.de/php-code/image-editing/invert-image/

Does anyone know how to do this?

Clive

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
"To err is human, but to really foul things up you need a computer." (Paul Ehrlich)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
To get the best answers from this forum see: faq102-5096

 

[grtammi]

If you got an image, why not apply a border to it instead? You can control this via css and a little PHP code.

CSS:

img.redbox  {
  border: 1px solid #f00 ;
}

img.blackbox {
  border: 1px solid #000 ; 
}

and your HTML / PHP could be similar to ( using your image from above )

<img src="Grid.bmp" style="width='100%';"
<?php

  if ( $var1 == 'red' )
    echo " class=\"redbox\" ;
  else
    echo " class=\"blackbox\" ;

?>
 />

which would then give a red box if the variable matches, or it defaults to a black box.

HTH

Greg

Greg

"for me, the action is the juice.

 

[Stretchwickster]

I think I am being misunderstood so I will try to explain better. When I say outline I don't mean a border I mean the pen colour which is used to draw the image. An example follows to clarify the question.

This is my original image:

I've managed to invert it (with the above PHP code) so that it looks like this:

I want to apply a mask/filter to change the pen colour from black to another colour (e.g. red):

All this can be achieved using the CSS code above but it only works in IE so I want to develop a server-side solution.

Clive

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
"To err is human, but to really foul things up you need a computer." (Paul Ehrlich)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
To get the best answers from this forum see: faq102-5096