demo_line_frm.html 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161
  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
  6. <title>APP</title>
  7. <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
  8. </head>
  9. <style type="text/css">
  10. body {
  11. background-color: #ffffff;
  12. }
  13. </style>
  14. <body>
  15. </body>
  16. <script type="text/javascript" src="../../../script/api.js" ></script>
  17. <script type="text/javascript">
  18. var winHeight,
  19. map,
  20. lat='39.989539',
  21. lon='116.384767';
  22. apiready = function(){
  23. winHeight = api.pageParam.height;
  24. api.parseTapmode();
  25. map = api.require('bMap');
  26. //打开地图
  27. open();
  28. };
  29. function open(){
  30. map.open({
  31. rect: {
  32. x: 0,
  33. y: winHeight,
  34. w: 'auto',
  35. h: api.frameHeight
  36. },
  37. center: {
  38. lon: lon,
  39. lat: lat
  40. },
  41. zoomLevel: 17,
  42. showUserLocation: true,
  43. fixedOn: '',
  44. fixed: true
  45. }, function(ret){
  46. if(ret){
  47. //获取位置坐标
  48. getLocation();
  49. }
  50. });
  51. }
  52. function getLocation(){
  53. api.showProgress({
  54. style: 'default',
  55. animationType: 'fade',
  56. title: '定位中...',
  57. text: '请稍候...',
  58. modal: false
  59. });
  60. map.getLocation({
  61. accuracy: '100m',
  62. autoStop: true,
  63. filter: 1
  64. }, function(ret, err){
  65. api.hideProgress();
  66. if(ret.status){
  67. lat = ret.lat;
  68. lon = ret.lon;
  69. //设置地图中心
  70. map.setCenter({
  71. coords: {
  72. lon: lon,
  73. lat: lat
  74. },
  75. animation:false
  76. });
  77. //根据坐标获取位置
  78. getNameFromCoords();
  79. }
  80. });
  81. }
  82. function getNameFromCoords(){
  83. map.getNameFromCoords({
  84. lon: lon,
  85. lat: lat
  86. },function(ret,err){
  87. if(ret.status){
  88. api.execScript({
  89. frameName:'demo_line_footer_frm',
  90. script:'showStartCity("'+ret.address+'")'
  91. })
  92. }
  93. });
  94. }
  95. function drawRoute(endLat,endLon){
  96. api.showProgress({
  97. style: 'default',
  98. animationType: 'fade',
  99. title: '绘制路线...',
  100. text: '请稍候...',
  101. modal: false
  102. });
  103. map.removeRoute({
  104. ids: [1]
  105. });
  106. map.searchRoute({
  107. id: 1,
  108. type: 'drive',
  109. policy: 'ecar_fee_first',
  110. start: {
  111. lon: lon,
  112. lat: lat
  113. },
  114. end: {
  115. lon: endLon,
  116. lat: endLat
  117. }
  118. }, function(ret, err){
  119. if(ret.status){
  120. map.searchRoute({
  121. type: 'drive',
  122. policy: 'ecar_fee_first',
  123. start: {
  124. lon: lon,
  125. lat: lat
  126. },
  127. end: {
  128. lat: endLat,
  129. lon: endLon
  130. }
  131. }, function(ret, err){
  132. if(ret.status){
  133. map.drawRoute({
  134. id: 1,
  135. index: 0,
  136. styles: {
  137. start: {
  138. icon: 'widget://image/mark_start.png'
  139. },
  140. end: {
  141. icon: 'widget://image/mark_end.png'
  142. }
  143. }
  144. }, function(ret){
  145. //api.alert({msg:JSON.stringify(ret)});
  146. });
  147. } else {
  148. //api.alert({msg:JSON.stringify(err)});
  149. }
  150. });
  151. }
  152. api.hideProgress();
  153. });
  154. }
  155. </script>
  156. </html>