Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jan 2012
    Thanked 0 Times in 0 Posts

    [QUESTION] Zooming in on map

    Hi all,

    I have a map of a topographical area divided into districts. On mouseover i'd like the district to light up en when pressing a mousebutton I would like to zoom in, showing only that district... which is divided into teams.

    Is that possible with JavaScript? Are there example-script for this purpose?

    Hope someone can help.


  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Thanked 4,744 Times in 4,706 Posts
    Various ways to do this. Easiest is to use multiple images that lay one on top of the other. Each one shows just one district. Use GIF or PNG images and have the part of each image that is outside its own district be transparent.

    You set the opacity such that they all appear a little dull. Then when the mouse is over one of them, you change its opacity so it appears brighter.

    When the mouse is clicked, you simply load in a *NEW* image, which is the zoomed-in image of that district showing the teams. You can just have the zoomed image have a higher z-index than the others so it will appear in front of all of them.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts