You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

49 line
1.4 KiB

  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
  7. <title>驾车导航-使用默认皮肤</title>
  8. <link rel="stylesheet" href="http://cache.amap.com/lbs/static/main.css?v=1.0"/>
  9. <style type="text/css">
  10. #panel {
  11. position: fixed;
  12. background-color: white;
  13. max-height: 90%;
  14. overflow-y: auto;
  15. top: 10px;
  16. right: 10px;
  17. width: 280px;
  18. }
  19. </style>
  20. <script type="text/javascript"
  21. src="http://webapi.amap.com/maps?v=1.3&key=b568111477df5420d6290da6ca282b1e">
  22. </script>
  23. </head>
  24. <body>
  25. <div id="mapContainer"></div>
  26. <div id="panel">
  27. </div>
  28. <script type="text/javascript">
  29. //基本地图加载
  30. var map = new AMap.Map("mapContainer", {
  31. resizeEnable: true,
  32. center: [116.397428, 39.90923],//地图中心点
  33. zoom: 13 //地图显示的缩放级别
  34. });
  35. //步行导航
  36. AMap.service(["AMap.Driving"], function() {
  37. var driving = new AMap.Driving({
  38. map: map,
  39. panel: "panel"
  40. }); //构造路线导航类
  41. // 根据起终点坐标规划步行路线
  42. driving.search([
  43. {keyword: '上海虹桥'},
  44. {keyword: '四季周庄'}
  45. ]);
  46. });
  47. </script>
  48. </body>
  49. </html>