map.js 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154
  1. const markers = [{
  2. id: 10,
  3. latitude: 30.279383,
  4. longitude: 120.131441,
  5. width: 50,
  6. height: 50,
  7. callout: {
  8. content: 'callout',
  9. },
  10. }];
  11. const includePoints = [{
  12. latitude: 30.279383,
  13. longitude: 120.141461,
  14. }];
  15. Page({
  16. data: {
  17. scale: 14,
  18. longitude: 120.131441,
  19. latitude: 30.279383,
  20. markers,
  21. includePoints,
  22. polyline: [{
  23. points: [{
  24. longitude: 120.131441,
  25. latitude: 30.279383,
  26. }, {
  27. longitude: 120.128821,
  28. latitude: 30.278200,
  29. }, {
  30. longitude: 120.131618,
  31. latitude: 30.277600,
  32. }, {
  33. longitude: 120.132520,
  34. latitude: 30.279393,
  35. }, {
  36. longitude: 120.137517,
  37. latitude: 30.279383,
  38. }],
  39. color: '#FF0000DD',
  40. width: 5,
  41. dottedLine: false,
  42. }],
  43. circles: [{
  44. latitude: 30.279383,
  45. longitude: 120.131441,
  46. color: '#000000AA',
  47. fillColor: '#000000AA',
  48. radius: 80,
  49. strokeWidth: 5,
  50. }],
  51. controls: [{
  52. id: 5,
  53. position: {
  54. left: 0,
  55. top: 300 - 50,
  56. width: 50,
  57. height: 50,
  58. },
  59. clickable: true,
  60. }],
  61. polygon: [{
  62. points: [{
  63. longitude: 120.131441,
  64. latitude: 30.279383,
  65. }, {
  66. longitude: 120.128821,
  67. latitude: 30.278200,
  68. }, {
  69. longitude: 120.131618,
  70. latitude: 30.277600,
  71. }, {
  72. longitude: 120.132520,
  73. latitude: 30.279393,
  74. }, {
  75. longitude: 120.137517,
  76. latitude: 30.279383,
  77. }],
  78. fillColor: '#BB0000DD',
  79. width: 5,
  80. }],
  81. },
  82. onReady() {
  83. // 使用 my.createMapContext 获取 map 上下文
  84. this.mapCtx = my.createMapContext('map');
  85. },
  86. getCenterLocation() {
  87. this.mapCtx.getCenterLocation({
  88. success: (res) => {
  89. my.alert({
  90. content: 'longitude:' + res.longitude + 'latitude:' + res.latitude,
  91. });
  92. console.log(res.longitude);
  93. console.log(res.latitude);
  94. },
  95. });
  96. },
  97. moveToLocation() {
  98. this.mapCtx.moveToLocation()
  99. },
  100. regionchange(e) {
  101. console.log('regionchange', e);
  102. },
  103. markertap(e) {
  104. console.log('marker tap', e);
  105. },
  106. controltap(e) {
  107. console.log('control tap', e);
  108. },
  109. tap() {
  110. console.log('tap:');
  111. },
  112. callouttap(e) {
  113. console.log('callout tap', e);
  114. },
  115. changeScale() {
  116. this.setData({
  117. scale: 8,
  118. });
  119. },
  120. restoreMarkers() {
  121. this.setData({
  122. markers,
  123. includePoints,
  124. });
  125. },
  126. changeCenter() {
  127. this.setData({
  128. longitude: 113.324520,
  129. latitude: 23.199994,
  130. });
  131. },
  132. setHeight() {
  133. this.setData({
  134. heightStyle: 'height:30px',
  135. });
  136. },
  137. changeMarkers() {
  138. this.setData({
  139. markers: [{
  140. id: 10,
  141. latitude: 30.538285,
  142. longitude: 104.074074,
  143. width: 50,
  144. height: 50,
  145. }],
  146. includePoints: [{
  147. latitude: 30.538285,
  148. longitude: 104.074074,
  149. }],
  150. });
  151. },
  152. });