Unable to Update GD Image Within A Webpage [Archive]

busdriver99

12-03-2010, 06:26 AM

Hi,
I am having trouble updating/refreshing an image that I have created in GD. I have created a GD image (draw.php) and another php file to display this image as part of a webpage. Then based on where a user clicks on the initial image, I am using the POST action to capture the coordinates (using input type=image) and want to draw a circle at that location.

The circle is only drawn successfully if I set my draw.php file as the action for the abc.php file, but this will take me to a page with only the image (instead, I want the image to update as part of the webpage). I have tried adding a javascript function to append a timestamp to force a refresh of the image, but that has not worked.

abc.php

<html>
<body>
<script type="text/javascript">

function reloadImg(id) {
var obj = document.getElementById(id);
var src = obj.src;
var pos = src.indexOf('?');
if (pos >= 0) {
src = src.substr(0, pos);
}
var date = new Date();
obj.src = src + '?v=' + date.getTime();
return false;
}

</script>
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
<input type="image" src="draw.php" name="ice" id="myIce" onclick="return reloadImg('myIce');" />
</form>

</body>
</html>

Draw.php:

<?php
header ("Content-type: image/jpeg");
$xx1=$_POST['ice_x'];
$yy1=$_POST['ice_y'];

...............................creating the Image here

// Drawing circle based on user coordinates
ImageFilledArc($im,$xx1,$yy1,25,25,0,360,$text_color,IMG_ARC_PIE);

ImageJpeg ($im);
imagedestroy($im);
?>

mlseim

12-03-2010, 03:31 PM

This was the best I could come up with.
It uses the built-in coordinates from a <form> image control.

Here is my test page:
http://www.catpin.com/draw

EDIT: I switched from SESSION to cookies.
The only problem I see now, it an occasional submit message
until the image is cached.

This is the index.php script:

<html>
<head>

</head>
<body>

<?=$_COOKIE['xx1']?> <?=$_COOKIE['yy1']?>
<br />

<form action="position.php" method="POST">
<input type="image" src="draw.php?xx=<?=$_COOKIE['xx1']?>&yy=<?=$_COOKIE['yy1']?>" name="ice" />
</form>

</body>
</html>

This is the draw.php script:

<?php

$xx1=$_GET['xx'];
$yy1=$_GET['yy'];

header ("Content-type: image/jpeg");

$filename="city.jpg";
$im = imagecreatefromjpeg($filename);

$white = imagecolorallocate($im, 0xFF, 0xFF, 0xFF);

// Drawing circle based on user coordinates
ImageFilledArc($im,$xx1,$yy1,25,25,0,360,$white,IMG_ARC_PIE);

ImageJpeg ($im);
imagedestroy($im);
?>

This is the "position.php" script that makes the cookie ...
It takes care of the extra header needed.

<?php
setcookie("xx1", $_POST['ice_x']);
setcookie("yy1", $_POST['ice_y']);
header ("location: index.php");
?>

.