ngmap
Version:
The Simplest AngularJS Google Maps V3 Directive
33 lines (30 loc) • 1.13 kB
HTML
<html>
<head>
<title>Travel modes in directions</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script src="script-tags-for-development.js"></script>
<style>
html, body {width:100%; height: 100%; padding:0; margin: 0}
body {padding: 5px}
* { box-sizing: border-box; }
</style>
</head>
<body ng-app="ngMap">
<div style="width: 68%; float:left; height: 100%">
<ng-map zoom="14" center="1135 Karamea-Kohaihai Rd, Kahurangi National Park, Tasman" style="height:90%" >
<directions
draggable="true"
panel="directions-panel"
travel-mode="DRIVING"
origin="1135 Karamea-Kohaihai Rd, Kahurangi National Park, Tasman"
destination="Pier St, Jackson Bay, West Coast, New Zeland">
</directions>
</ng-map>
Directions path length:
{{map.directionsRenderers[0].directions.routes[0].overview_path.length}}
</div>
<div id="directions-panel" style="width: 28%; float:left; height: 100%; overflow: auto; padding: 0px 5px">
</div>
</body>
</html>