- Home >
- Documentation >
- Services >
- directionsrenderer
directionsrenderer
This function will display a route on the map and send text-based directions to a given div using the function google.maps.DirectionsRenderer when given an address. This function renders the directions using Google's DirectionsResult object styling when retrieved from the DirectionsService.
Usage
Adding the direction renderer, it is possible to display the directions in a div setting using either the divId property or the container one.
Parameters
- divId {string} Id of the targetted div to render the directions (optional)
- container {string|node|jQuery} css selector of div node of the targetted div to display the directions (optional)
- options {google.maps.DirectionsRendererOptions}
Example
This example will display a route on the map from a given address and adds the directions into a given div.
$("#test").gmap3({ getroute:{ options:{ origin:"48 Pirrama Road, Pyrmont NSW", destination:"Bondi Beach, NSW", travelMode: google.maps.DirectionsTravelMode.DRIVING }, callback: function(results){ if (!results) return; $(this).gmap3({ map:{ options:{ zoom: 13, center: [-33.879, 151.235] } }, directionsrenderer:{ container: $(document.createElement("div")).addClass("googlemap").insertAfter($("#test")), options:{ directions:results } } }); } } });