No announcement yet.

link map development

  • Filter
  • Time
  • Show
Clear All
new posts

  • link map development

    I'm no big time scripter, still a work in progress
    but not looking for a copy/paste either


    a US map


    when click on state of user choice -
    - friendly pop screen displayed listing cities/locale

    * alreadycompiling list to be displayed,
    need back-end assistance for action
    it is non-Flash site, pure infrastructure


    map of states to get an idea

    Matt - creator

  • #2
    any constructive help is appreciated
    thank you

    Matt - creator


    • #3
      I'm not an expert but you could do it with an image map and Javascript/CSS.

      One way would be to have your 50 <ul> or <div> elements hidden and set to {display: visible} when that particular state is clicked.
      It would be quite a heavy page but I'm not sure how to get round that other than using something server-side to take the click data and generate a new page dynamically. Then you would have a bit of a wait between clicking and seeing the list. You could generate the pop-ups dynamically in Javascript on the Client side, maybe store all the info in a separate javascript file. Ryan or someone might be able to help you.

      By the way, if you can, make the map bigger so that you can squeeze in the State names onto the map (like with NJ etc). Otherwise it's not going to be easy for someone to click DC! Do they click the letters or the map?
      Om Namah Shivaya
      Business website: Jackfruit Design
      Personal blog:


      • #4
        they click the letters, attached image is not actual map
        that's too conservative
        mine is messy as hell and you wonder if that's cape cod, MA or a skinny geek trying to flex his arm

        still, design PRINCIPLE will be strong.

        I'm kind of lost with the hidden/visible elements (to tell the truth, not great JSer)
        i'm still a genius under study
        but I'll see if I can find some tutorials on it
        I'm almost embarrased to say I'm not fully understanding the <ul> or <div> choices either
        but my stupid ass will be hitting the books

        stupid, not ignorant

        thank you for the encouragement and eye-opening Benjamin
        have a good day

        Matt - creator


        • #5
          any other suggestions, hints, tips,

          please feel free to send my way

          I LOVE the negative ones a bit more if you let me know why I'm so dumb

          'you dress funny, what's them wierd sacks on the side of your pants?'

          - possible fashion statement down the road: cargo pockets on business suits

          is it dare or flare?

          Matt - creator


          • #6
            the lists that are to be 'pop'd-up' aren't too lengthy, just text, 2-3KB of info

            I'm thinking to utilize a good spacing/placement method of type hyperlink (MA,SC, etc.)
            placed over a fixed bg image (the map)

            simple _blank target reference added to simple link
            and maybe even prior denote smaller size pop windows but still allow scrolling

            and you got simple, yet effective means

            and I can get started on it, rather than learning a whole new ball game

            put me in coach?
            am I being to stubborn to take a few check swings before entering the batter's box?

            Matt - creator




            • #7
              I'm a KISS kinda guy

              Keep It Simple Stupid

              Matt - creator




              • #8
                would using CSS absolute positioning of the text elements be acceptable
                even if I'm worrisome about users not having CSS capability?

                or are they too old school?

                sorry to be adding all these little tidbits here and there
                guess I'm a do-as-I-goer, high-energy

                sorry to put added bandwith admin's
                but, think, add an edit feature to personal topic entries/replies and problem fixed

                Matt - creator




                • #9

                  I would suggest that you add an image map that will allow you to send the state back to your server side script and then generate a new page. Yeah its a server hit but it will be less of a headache in the long run. Its also more efficient as the pages will be much smaller.

                  The other option is a little more complicated but very doable once you understand the concept. You can have a javascript procedure open a new window which would call a server side script that will fill in the <div> of your choice with the information that you requested. Basically its like running a procedure or task on the server without refreshing the page but you get new data inserted into your existing web page. Its similiar to when you select, for example, country and the next drop down suddenly fills with all the state names...

                  Either way the client side image map is the way to go. Just remember to make the small state NAMES clickable as well as their state outline.

                  I usually do the image maps in fireworks and scale the image down after I'm done.

                  I can show you samples of all the above if you'd like.

                  - Bill


                  • #10
                    go gates!

                    i'm an IE looker

                    not an IE hooker

                    sorry guys

                    MS rules! Buy windows now!
                    (shameless propaghanda plug-in)

                    Matt - creator




                    • #11

                      firstly - haha. you post the way i think. ha!

                      secondly - there usually is an edit feature. allen's been tinkering with the forum since, well, since i joined, so i should imagine it's just a passing thing.

                      thirdly - there's actually a tutorial in dreamweaver mx with that exact same problem. well, maybe not exact, because instead of popups, you get different coloured states, but still...if you don't already have dreamweaver, try downloading a trial version of mx and looking at the tutorials!

                      oh, and PLEASE don't fuss if you don't like dw. i don't either, but i like it more than thinking about code, and it's got the design/code feature that'll help you understand what you're actually doing - so you can cut and paste!


                      I want to lie, Shipwrecked and comotoase drinking fresh mango juice,
                      Goldfish shoals nibbling at my toes, fun, fun, fun, in the sun, sun, sun...


                      • #12
                        I have dreams but when I wake, I'm a creator
                        not a weaver
                        dreamweaver is plug and chug, no self-taught lesson
                        or feel good emotion

                        just let me place these where I want and let computer do work

                        I like telling CPU what to do

                        now <deltree> you biaotch
                        {cracks whip over monitors ass}

                        nerd ? of day:
                        do monitors have ass?

                        Matt - creator




                        • #13
                          whatever you say: i can do that map roll-over thing already.

                          i think most monitors do have an ass, but it's mostly the person staring at them.

                          good luck with the rest of the project - post it when you're done!

                          I want to lie, Shipwrecked and comotoase drinking fresh mango juice,
                          Goldfish shoals nibbling at my toes, fun, fun, fun, in the sun, sun, sun...


                          • #14

                            Here is what an image map looks like in HTML:

                            <meta http-equiv='Content-Type' content='text/html;'>
                            <!--Fireworks MX 2004 Dreamweaver MX 2004 target. Created Sat Jul 24 07:26:23 GMT-0700 (Pacific Daylight Time) 2004-->
                            <img name='n50states' src='50states.gif' width='487' height='341' border='0' usemap='#m_50states' alt=''><map name='m_50states'>
                            <area shape='poly' coords='45,98,94,110,80,178,76,178,74,186,38,130' href='map.php?state=nv' title='Nevada' alt='Nevada' >

                            The relevant part is this:

                            <img name='n50states' src='50states.gif' width='487' height='341' border='0' usemap='#m_50states' alt=''><map name='m_50states'>
                            <area shape='poly' coords='45,98,94,110,80,178,76,178,74,186,38,130' href='map.php?state=nv' title='Nevada' alt='Nevada' >

                            Since I live in Nevada I thought I'd do that state. All of the coords are pixel positions on the map. When you hover over Nevada you'll the the state name. If you click on Nevada it will load up map.php?state=nv

                            Well so much for image maps....


                            • #15
                              no need to get testy uncle
                              didn't think you'd get sour
                              don't be a sore loser
                              just pull out your sword and yell touche'

                              axoi, you the man
                              thank you for input

                              but lost with php and <area shape='poly'? coords=??? ??? big ??? numbers???
                              works nice but all those numbers in coords alone is Charlie Brown mom mumbo jumbo

                              further explaination please?

                              Matt - creator








                              Incredible Stock

                              Latest Topics


                              • B
                                Reply to ​What is your favorite forum software?
                                I'd normally let these kinds of things go as a matter of opinion, but in this case, with people recommending vBulletin, I need to say something.

                                Quite likely the worst so-called upgrade in...
                                Today, 07:39 PM
                              • B
                                Reply to Heatmap help
                                If by combine, you mean overlay them on top of each other while preserving and combining the red areas of both, yes, Photoshop can easily do it -- at least in this particular instance with these two images....
                                Today, 07:11 PM
                              • B
                                Comment on Design Help
                                You know, back when I was in college, I remember taking stock of all the bad design around me -- from supermarket aisles to magazine layouts, it was everywhere. I mistakenly thought this whole design...
                                Today, 06:59 PM
                              • Risen28
                                Reply to Design Help
                                Oh man , its like biggs said this happens with every graphic designer and web designer. I Find it quite ironic when some clients pay you for your service ,"which is to provide a effective design...
                                Today, 04:41 PM
                              • h!ghC
                                Heatmap help
                                Hello everyone,

                                I have a few heatmaps generated from a running app, which look like this:


                                Now, I would like to combine all of these heatmaps into one single heatmap....
                                Today, 03:06 PM
                              GDF A division of Mediabistro Holdings Adweek | Mediabistro | Clio | Film Expo Group Contact Us | Terms of Use | Privacy Policy Copyright 2016 Mediabistro Holdings