funstad Posted August 10, 2014 Share Posted August 10, 2014 (edited) SOLVED (Thanks to JamesB) Hey all, I use Google Maps to allow people to navigate to our shop.the problem is that my route description always disappears under my footer.When I resize my browser directions get fully displayedso the problem is in my maxheight.js So i search a way that when calcRoute() is launched my maxheight resize without the need of resize my browers. Google JS code: <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> <script type="text/javascript"> var directionDisplay; var directionsService = new google.maps.DirectionsService(); function initialize() { var latlng = new google.maps.LatLng(51.100899,4.415780); directionsDisplay = new google.maps.DirectionsRenderer(); var myOptions = { zoom: 17, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP, mapTypeControl: false }; var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions); directionsDisplay.setMap(map); directionsDisplay.setPanel(document.getElementById("directionsPanel")); var image = '../images/contact/mapsicon.png'; var marker = new google.maps.Marker({ position: latlng, title: 'Rijwielen De Zwaluw NV', map: map, icon: image }); } function calcRoute() { var start = document.getElementById("routeStart").value; var end = "51.100899,4.415780"; var request = { origin:start, destination:end, travelMode: google.maps.DirectionsTravelMode.DRIVING }; directionsService.route(request, function(response, status) { if (status == google.maps.DirectionsStatus.OK) { directionsDisplay.setDirections(response); } else { if (status == 'ZERO_RESULTS') { alert('No route could be found between the origin and destination.'); } else if (status == 'UNKNOWN_ERROR') { alert('A directions request could not be processed due to a server error. The request may succeed if you try again.'); } else if (status == 'REQUEST_DENIED') { alert('This webpage is not allowed to use the directions service.'); } else if (status == 'OVER_QUERY_LIMIT') { alert('The webpage has gone over the requests limit in too short a period of time.'); } else if (status == 'NOT_FOUND') { alert('At least one of the origin, destination, or waypoints could not be geocoded.'); } else if (status == 'INVALID_REQUEST') { alert('The DirectionsRequest provided was invalid.'); } else { alert("There was an unknown error in your request. Requeststatus: nn"+status); } } }); } </script> Edited August 13, 2014 by funstad Link to comment Share on other sites More sharing options...
justsomeguy Posted August 11, 2014 Share Posted August 11, 2014 Look inside maxheight for whatever it does when the browser is resized, and run the same code after adding the directions. It will probably be listening for a resize event. Link to comment Share on other sites More sharing options...
funstad Posted August 12, 2014 Author Share Posted August 12, 2014 Look inside maxheight for whatever it does when the browser is resized, and run the same code after adding the directions. It will probably be listening for a resize event. I have added the maxheight.js script.I have totally no clue how to do this because i only know a few things about js.So i'm looking for someone who can help me with this. Link to comment Share on other sites More sharing options...
justsomeguy Posted August 12, 2014 Share Posted August 12, 2014 Search through the code for "resize" and see what you find. There should be an event handler for a resize event. Link to comment Share on other sites More sharing options...
funstad Posted August 12, 2014 Author Share Posted August 12, 2014 (edited) This is what i found with resize: // Refresh elements height onResize event var __expand = this.expand; if (window.addEventListener) { window.addEventListener('resize', function(event) {return __expand.apply(__object, [( event || window.event)])}, false);} else if (window.attachEvent) { window.attachEvent('onresize', function(event) {return __expand.apply(__object, [( event || window.event)])}); } }, Edited August 12, 2014 by funstad Link to comment Share on other sites More sharing options...
justsomeguy Posted August 12, 2014 Share Posted August 12, 2014 It looks like it runs the __expand function in the context of __object (I'm not sure what __object is set to), and it passes the function the event object. Looking at the source on Google Code, it doesn't look like the expand method uses the parameter. How do you use that code on your page? Link to comment Share on other sites More sharing options...
funstad Posted August 12, 2014 Author Share Posted August 12, 2014 (edited) I think i need to add some changes in the code below but adding ElementMaxHeight(); doesnt work. if (status == google.maps.DirectionsStatus.OK) {directionsDisplay.setDirections(response); } else { It's called like this: <body onload="new ElementMaxHeight();"></body> Edited August 12, 2014 by funstad Link to comment Share on other sites More sharing options...
funstad Posted August 13, 2014 Author Share Posted August 13, 2014 still looking for help its urgent Link to comment Share on other sites More sharing options...
JamesB Posted August 13, 2014 Share Posted August 13, 2014 Try changing <body onload="new ElementMaxHeight();"> to: <body onload="maxHeight = new ElementMaxHeight();"> and add: maxHeight.expand.call(maxHeight); under: directionsDisplay.setDirections(response); If that doesn't work can you post a link to your site. Link to comment Share on other sites More sharing options...
funstad Posted August 13, 2014 Author Share Posted August 13, 2014 Try changing <body onload="new ElementMaxHeight();"> to: <body onload="maxHeight = new ElementMaxHeight();"> and add: maxHeight.expand.call(maxHeight); under: directionsDisplay.setDirections(response); If that doesn't work can you post a link to your site. I have just added it but when u press on calculate route (Bereken route) nothing happens. site: http://tinyurl.com/mxgu25v Link to comment Share on other sites More sharing options...
JamesB Posted August 13, 2014 Share Posted August 13, 2014 I managed to get it working using a timer, I'm not sure which data needs to be updated to avoid using a timer, but it works with an interval of 1 millisecond. change maxHeight.expand.call(maxHeight); to setTimeout(function() { maxHeight.expand.call(maxHeight); }, 1); 1 Link to comment Share on other sites More sharing options...
funstad Posted August 13, 2014 Author Share Posted August 13, 2014 (edited) I managed to get it working using a timer, I'm not sure which data needs to be updated to avoid using a timer, but it works with an interval of 1 millisecond. change maxHeight.expand.call(maxHeight); to setTimeout(function() { maxHeight.expand.call(maxHeight); }, 1); thank you! Here I was looking for a couple of weeks! Edited August 13, 2014 by funstad Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now