Hey guys, I have a very popular paintball website where users can post what's called 'paintball reports'. They type-in which state and location they had a game at and they give details on the game, results, etc. I want to provide aerial images (which I already have) of the popular paintball outdoor courses and allow the visitor to click on the aerial image of their course and add little 'markers' showing where "kills" were made during the game.
Does anyone know how this can be done? The paintball reports system is in php/mysql. I just have no idea how I would go about making something like this interactive. Any advice would be greatly appreciated!!! Take care.
Image Marking Script
Moderator: General Moderators
- seodevhead
- Forum Regular
- Posts: 705
- Joined: Sat Oct 08, 2005 8:18 pm
- Location: Windermere, FL
- trukfixer
- Forum Contributor
- Posts: 174
- Joined: Fri May 21, 2004 3:14 pm
- Location: Miami, Florida, USA
you can do it with javascript and an image map, submitting x,y co-ordinates for each point and then use GD to write whatever (color coded dots?) into a copy of the image.. javascript would note the click points into an array on the image map, and the submit button would send the data .. or if you wanted , you can also do it the more complex way, and just use teh image as a big submit button (using an image as a submit button, you will receive an x,y co-ordinate for the click) I can think of several ways to do it... but I'd say the first one would be optimal
Using an image submit button is considerably simpler..
The form:
When a user clicks a point on the map it'll submit the form with pbm_x and pbm_y coordinates. You would put these into a database.
To display the map you'd use <img src="paintballmap.php"> .. paintballmap.php would consist of..
Obviously that would be a very basic map with just red dots all over it. It's pretty easy to take it further though, with names, or a key, or different colour dots..
If you look here: http://www.ooer.com/photowall/viewmap.php?map=london .. you'll see a similar system I wrote to generate a map of where users of a different forum are located.
The form:
Code: Select all
<form action="index.php" method="POST">
<input type="image" name="pbm" src="paintballmap.jpg">
</form>To display the map you'd use <img src="paintballmap.php"> .. paintballmap.php would consist of..
Code: Select all
//Stuff to get the x and y coordinates from the database as $result.
$i = imagecreatefromjpeg("paintballmap.jpg");
$color = imagecolorallocate($i,255,0,0);
while ($record = mysql_fetch_object($result)) {
imagefilledellipse($i,$record->x,$record->y,4,4,$color);
}
header("Content-type: image/jpeg");
imagejpeg($i);
imagedestroy($i);If you look here: http://www.ooer.com/photowall/viewmap.php?map=london .. you'll see a similar system I wrote to generate a map of where users of a different forum are located.
- seodevhead
- Forum Regular
- Posts: 705
- Joined: Sat Oct 08, 2005 8:18 pm
- Location: Windermere, FL
At once .. can't be done in standard HTML.seodevhead wrote:How do I go about allowing the same visitor to select multiple points at once?
If I were doing it I'd just give them a form with the image submit button and a proper submit button. When they click the image it submits, adds a location saved in their session or a temporary table, and gives them the form again .. when they click the proper submit button it saves everything to the database.