/    Sign up×
Community /Pin to ProfileBookmark

dynamic map problem..need some help

I got the following challenge on my hands using web technologies(PHP,HTML,Javascript and MySQL database) :

The final output should be somehow like this: I have to display an image in a HTML page(eg: the image could be a map of a region) that has some designated spots on it(spot’s coords x,y are read from a database table). Each spot must be a link to some page.
My problem is that the spots must be visible(can’t use only the <map> tag couse it doesn’t make the hotspots visible)
I can’t alter the image because I have to load spots on different locations each time a page loads based on the user’s choice.

I’ve thought about one scenario where I would alter the image using php image functions(add some circles on the custom image each time I load a page) and then place hotspots over the altered image’s spots using map and area tags.
This is a bit problematic because I don’t have direct access on the server(must import some php library in order to make the image functions work)

I presume this could be done somehow very easy using javascript but I have no idea how…If you do please let me know.

thank you

Chris

to post a comment
HTML

1 Comments(s)

Copy linkTweet thisAlerts:
@FangOct 22.2004 — Just CSS; grab the link details from the database and write them into the html with php.
&lt;div style="position:relative;"&gt;
&lt;img alt="map" src="map.gif" height="350" width="800" /&gt;
&lt;a href="http://www.mySite.com/Link/"&gt;&lt;img alt="spot" style="position:absolute; top:100px; left:200px;" src="spot.gif" height="5" width="5" /&gt;&lt;/a&gt;
&lt;/div&gt;
×

Success!

Help @sonofkyuss spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...