www.webdeveloper.com
Results 1 to 4 of 4

Thread: Google Maps API Customization - How??

  1. #1
    Join Date
    Jun 2012
    Posts
    6

    Google Maps API Customization - How??

    I'm making a website that features listings using the Google Maps API. I've read over a few solutions (https://developers.google.com/maps/a...toomanymarkers) but nothing is really doing what I want.

    I have thousands of markers, and when my website displays a "state" that users choose, the thousand/s of markers clutter up the page or make load time really bad--it is just unusable at the moment.

    I know of MapClusterer, but I have something else in mind. I'd like my website to say, "There are too many listings in your area, please zoom in further to view listings" --Basically, the map doesn't load the listings until the user zooms in to the X zoom setting. THEN the map only loads listings that are within the user's map frame of view. So instead of loading thousands of listings onto a map, it only loads what the user is currently looking at.

    What I want sortof works like (this -- http://www.johnlscott.com/SearchInte...132589&Zoom=12). Where if you are zoomed out too far it tells you "zoom in more, then you'll see listings". It is doing this because there are too many listings and it will be all cluttered/too slow if they showed them all-- I need this too! Any advice on where I can go or how I can get this done?

    Thanks!

  2. #2
    Join Date
    Jun 2012
    Posts
    6
    bump....nothin guys?

  3. #3
    Join Date
    Dec 2005
    Posts
    2,984
    It's not that hard to figure out, especially if you've made it as far as plotting thousands of markers on the map.

    In order to be adding thousands of markers, you must be looping over a data set. So, before you start adding markers, just check the size of the data set - if it's bigger than whatever arbitrary number you choose, then display a message instead of the markers.

    EDIT: One thing that may help you is this code:

    Code:
    var latlng,total=0,bounds = map.getBounds();
    
    for(i in dataset) {
      latlng = new google.maps.LatLng(dataset.lat,dataset.lng);
      if(bounds.contains(latlng)) {
        total++;
      }
    }
    I'm assuming your main problem is that you just grab everything when a user selects a state. The above code will allow you loop through all the points in your dataset and check if the marker is contained within the current bounds of the map.

    Hopefully that helps.
    Last edited by aj_nsc; 06-07-2012 at 01:18 PM.
    I've switched careers...
    I'm NO LONGER a scientist,
    but now a web developer...
    awesome.

  4. #4
    Join Date
    Jun 2012
    Posts
    6
    Thanks AJ, you are right, that is pretty simple.

    I'll give this a shot and post results!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles