Listing zoom

72 views
Skip to first unread message

Am

unread,
Oct 31, 2011, 10:40:33 AM10/31/11
to google-map...@googlegroups.com
I wasn't able to find another post similar to my question, but I'm hoping someone can help walk me through this.

How do I set the zoom level of the map when I search for properties? I don't have a url, so I'm not sure how to set the zoom. For example: When I search for an address that does not have a property in the search radius, my map zooms in 100% to the address. It does the same if there is only 1 property in the search radius. How do I change it so it only zooms in part way, like 50% (or zoom=7)? I don't have a url anywhere in my code; it's all php and javascript.

http://www.rentalmatch101.com.php5-20.dfw1-1.websitetestlink.com/googlemap.php

Thank you for your help.

Martin™

unread,
Oct 31, 2011, 1:31:45 PM10/31/11
to Google Maps JavaScript API v3
Hi.

Try updating your code so it knows how many markers have been created
and sets the map bounds based on that:

[code]
var visibleMarkersCount=0;
for (var i = 0; i < markerNodes.length; i++) {
var id = markerNodes[i].getAttribute("property_id");
var city_id = markerNodes[i].getAttribute("city");
var state_id = markerNodes[i].getAttribute("state");
var country_id = markerNodes[i].getAttribute("country");
var postal_code = markerNodes[i].getAttribute("postal_code");
var address = markerNodes[i].getAttribute("street");
var price = markerNodes[i].getAttribute("price");
var bedrooms = markerNodes[i].getAttribute("bedrooms");
var bathrooms = markerNodes[i].getAttribute("bathrooms");
var category_id = markerNodes[i].getAttribute("type");
var living_area = markerNodes[i].getAttribute("sqft");
var lot_area = markerNodes[i].getAttribute("lotsqft");
var listing_type_id = markerNodes[i].getAttribute("listing");
var building_name = markerNodes[i].getAttribute("building_name");
var distance = parseFloat(markerNodes[i].getAttribute("distance"));
var googlemap_ltgooglemap_ln = new google.maps.LatLng(
parseFloat(markerNodes[i].getAttribute("googlemap_lt")),
parseFloat(markerNodes[i].getAttribute("googlemap_ln")));
createOption(address, distance, i+1);
createMarker(googlemap_ltgooglemap_ln, address, city_id, state_id,
country_id, postal_code, price, bedrooms, bathrooms, category_id,
living_area, lot_area, building_name, listing_type_id, id);
bounds.extend(googlemap_ltgooglemap_ln);
visibleMarkersCount++;
}

switch(visibleMarkersCount){
case 0:
// no markers have been created
// set map zoom and center accordingly - or just it leave it as it
is
break;
case 1:
// a single marker has been created
// center on the marker but set a zoom level that's not fully zoomed
in
break;
default:
// two or more markers have been created
// fit the map to the markers
map.fitBounds(bounds);
}
[/code]

http://www.w3schools.com/js/js_switch.asp

Martin.
> http://www.rentalmatch101.com.php5-20.dfw1-1.websitetestlink.com/goog...

Am

unread,
Oct 31, 2011, 2:00:13 PM10/31/11
to google-map...@googlegroups.com
Thank you for the advice. It's really helpful, but I don't know how to set the zoom level. I know I just add &zoom=12 to the url, but my code doesn't have a url, just variables and functions. How do I set the zoom if I don't have a url?

davie strachan

unread,
Oct 31, 2011, 2:40:41 PM10/31/11
to Google Maps JavaScript API v3
Hi Am
I see you have used my code to show no properties found
You do not need to send zoom level in url as i does not send anything
back in the XML
When nothing is found the XML is <marker street="No properties found"
googlemap_lt="40" googlemap_ln="-100" distance="0"/>
If you replace
for (var i = 0; i < markerNodes.length; i++) {


if (markerNodes[0].getAttribute("street")=="No properties found"{
map.setZoom(4);
}
for (var i = 0; i < markerNodes.length; i++) {

This should do it

Regards Davie

Rossko

unread,
Oct 31, 2011, 3:18:48 PM10/31/11
to Google Maps JavaScript API v3
> How do I set the zoom if I don't
> have a url?

You already have this line in your code
map.setZoom(6);
you might guess that is the way to do it.

The task is really to set that zoom level in the circumstance(s) where
you don't like the automatic zoom, as outlined by Martin

Am

unread,
Oct 31, 2011, 3:40:39 PM10/31/11
to google-map...@googlegroups.com
Thank you for the help. I assume I did this incorrectly since it's not zooming in when I search (longwood, fl, 5mi for example).
Here is my code:

function searchLocationsNear(center) {
     clearLocations();

     var radius = document.getElementById('radiusSelect').value;
     var searchUrl = 'phpsqlsearch_genxml.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius;
     downloadUrl(searchUrl, function(data) {
       var xml = parseXml(data);
       var markerNodes = xml.documentElement.getElementsByTagName("marker");
       var bounds = new google.maps.LatLngBounds();
      
       sidebarInfo = ""; //this clears the list in the sidebar with each search
       var visibleMarkersCount=0;
       if (markerNodes[0].getAttribute("street")=="No properties found"){
             map.setZoom(8);
        map.setZoom(8);

        break;
        case 1:
        // a single marker has been created
        // center on the marker but set a zoom level that's not fully zoomed in
        map.setZoom(8);

        break;
        default:
        // two or more markers have been created
        // fit the map to the markers
        map.fitBounds(bounds);
}
       map.fitBounds(bounds);
         //map.setZoom(8);
       /*locationSelect.style.visibility = "visible";
       locationSelect.onchange = function() {
         var markerNum = locationSelect.options[locationSelect.selectedIndex].value;
         google.maps.event.trigger(markers[markerNum], 'click');
       };*/
      });
    }

The commented out map.setZoom(8); (8 lines from the bottom) set the zoom of the map on search, but didn't zoom out when there were more than one properties (if that made sense).

What did I do wrong?
Thank you for the help.

Am

unread,
Oct 31, 2011, 3:42:54 PM10/31/11
to google-map...@googlegroups.com
sorry, that was Longwood, FL 10mi, not 5mi.

davie strachan

unread,
Oct 31, 2011, 4:09:44 PM10/31/11
to Google Maps JavaScript API v3
Hi Am
This code has been added after the last time I looked
visibleMarkersCount++;
}
switch(visibleMarkersCount){
case 0:
// no markers have been created
// set map zoom and center accordingly - or just it leave it
as it
is
map.setZoom(8);
break;
case 1:
// a single marker has been created
// center on the marker but set a zoom level that's not fully
zoomed in
map.setZoom(8);
break;
default:
// two or more markers have been created
// fit the map to the markers
map.fitBounds(bounds);
}
If you comment it out and change my code to
if (markerNodes[0].getAttribute("street")=="No properties found"){
zoom =8;
}
else{
zoom = 12;
}

and later
map.fitBounds(bounds);
//map.setZoom(8);

to
map.fitBounds(zoom);
//map.setZoom(8);

If that doesnt work use alerts to see what is hapening

Regards Davie

Am

unread,
Nov 2, 2011, 4:41:51 PM11/2/11
to google-map...@googlegroups.com
Thank you for helping me. I changed the code like you suggested. When I search (arvada, co; 10mi) the marker displays on the map, but the map zoom doesn't change. It stays at the full US zoom. I tried changing the zoom level in the code zoom =8; and nothing happened. I can zoom in manually, but that's it.

When I then search again, the map doesn't move out of the manual zoom.

For example, I searched for arvada, co at 10mi. The map didn't zoom, so I manually zoomed in a bit. I searched again for los lunas, nm at 10mi, and the map didn't move to the new marker, and the zoom didn't change. There should be 1 property set at arvada, co; 10mi, and no properties at los lunas, nm.

Did I make sense? Did I miss something somewhere?

Rossko

unread,
Nov 2, 2011, 5:21:49 PM11/2/11
to Google Maps JavaScript API v3
In your code you have
map.fitBounds(zoom);
You can't fitBounds to an integer number.
You perhaps meant map.setZoom(zoom), but this would be a poor place to
do that unconditionaly as it would mess up any previous fitBounds, if
there happened to be one.

davie strachan

unread,
Nov 3, 2011, 5:53:05 AM11/3/11
to Google Maps JavaScript API v3
Hi Am
Is this what you are looking for
huttp://daviestrachan.zxq.net/maps/stationmap5.php
try paris &london 25miles
I suggest you try my map changing the searchUrl to your own and if it
works modify it to suit your own requirements.
Your problem seems to be that you added parts to the origonal code
without understanding what each bit did
eg
switch(visibleMarkersCount){
case 0:
// no markers have been created
// set map zoom and center accordingly - or just it leave it as it
is
map.setZoom(8);
break;
case 1:
// a single marker has been created
// center on the marker but set a zoom level that's not fully zoomed
in
map.setZoom(8);
break;
default:
// two or more markers have been created
// fit the map to the markers
map.fitBounds(bounds);*/

In your case there is always at least one XML marker (No Property
Found)

Regards Davie

davie strachan

unread,
Nov 3, 2011, 5:55:16 AM11/3/11
to Google Maps JavaScript API v3

Am

unread,
Nov 7, 2011, 4:47:55 PM11/7/11
to google-map...@googlegroups.com
Thank you for your help. I think that is what I'm looking for. Before I made changes (which recently broke the page) it would zoom in 100%. I have no idea what any of the code does. I'm not a programmer, I just wanted to build the map without having to purchase one already made. Do I have code in there that I don't need?

Am

unread,
Nov 8, 2011, 2:00:29 PM11/8/11
to google-map...@googlegroups.com
Ok, I figured it out. I needed to add

       if (map.getZoom() > 16) {// Change max/min zoom here
       //alert();
                map.setZoom(16);
        }       

after
      map.fitBounds(bounds);

davie

unread,
Nov 8, 2011, 4:43:56 PM11/8/11
to Google Maps JavaScript API v3
Hi Am
There is always a problem when you add code you don't understand.
The switch(visibleMarkersCount) code would probably work if no marker
returned in the XML
But as the XML always returned a marker (actual or no record) this
function was not suitable.
It is always advisable to try and understand the logic of a code
snippet to see if it gives the required result before adding it to
your code

I see you have got the zoom fixed
Now to query the database with rooms and bathrooms

Post here if you want help with query

Regards Davie

Am

unread,
Nov 10, 2011, 12:05:15 PM11/10/11
to google-map...@googlegroups.com
I would love help with that! I've been looking online for something that tells me how to add additional fields to the search but I'm not having any luck. I'm trying to search by bathrooms, bedrooms, price min and max, and rent, rent to own, or contract purchase. I don't know where to start.

Am

unread,
Nov 11, 2011, 1:41:36 PM11/11/11
to google-map...@googlegroups.com
I got it all set up. Thank you for your help. I appreciate it.
Reply all
Reply to author
Forward
0 new messages