api.js 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569
  1. var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
  2. function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
  3. import forOwn from 'lodash/forOwn';
  4. import isEqual from 'lodash/isEqual';
  5. import isNil from 'lodash/isNil';
  6. import isEmpty from 'lodash/isEmpty';
  7. //import loadjscssfile from './loadScript';
  8. import APILoader from './APILoader';
  9. export var loadApi = function loadApi() {
  10. var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '0325e3d6d69cd56de4980b4f28906fd8';
  11. return new APILoader({
  12. key: key,
  13. useAMapUI: false,
  14. version: '1.4.7',
  15. protocol: 'https'
  16. }).load();
  17. };
  18. export var loadMap = function loadMap(key) {
  19. return new Promise(function (resolve, reject) {
  20. if (window.AMap) {
  21. resolve(window.AMap);
  22. }
  23. loadApi(key).then(function (ret) {
  24. if (window.AMap) {
  25. resolve(window.AMap);
  26. } else {
  27. reject(new Error('window.AMap不存在!'));
  28. }
  29. }).catch(function (error) {
  30. reject(new Error('加载地图错误!' + error.message));
  31. });
  32. });
  33. };
  34. // export const loadApiV1 = async (key = '0325e3d6d69cd56de4980b4f28906fd8') => {
  35. // return await loadjscssfile(
  36. // 'https://webapi.amap.com/maps?v=1.4.7&key=' + key,
  37. // 'js'
  38. // );
  39. // };
  40. // export const loadMapV1 = key => {
  41. // return new Promise((resolve, reject) => {
  42. // if (window.AMap) {
  43. // resolve(window.AMap);
  44. // }
  45. // loadApi(key)
  46. // .then(ret => {
  47. // if (window.AMap) {
  48. // resolve(window.AMap);
  49. // } else {
  50. // reject(new Error('window.AMap不存在!'));
  51. // }
  52. // })
  53. // .catch(error => {
  54. // reject(new Error('加载地图错误!' + error.message));
  55. // });
  56. // });
  57. // };
  58. /**
  59. * [加载插件](https://lbs.amap.com/api/javascript-api/guide/abc/plugins)
  60. * 加载完成后,可以调用:
  61. * var toolbar = new AMap.ToolBar();
  62. * map.addControl(toolbar);
  63. * @param {string} name 插件名或插件数组,如:AMap.ToolBar,['AMap.ToolBar','AMap.Driving']
  64. */
  65. export var loadPlugin = function loadPlugin(name) {
  66. return new Promise(function (resolve, reject) {
  67. if (window.AMap) {
  68. window.AMap.plugin(name, function () {
  69. resolve(true);
  70. });
  71. //是否有加载失败的情况,如果加载失败,怎么reject?
  72. } else {
  73. reject(new Error('地图还未加载!'));
  74. }
  75. });
  76. };
  77. ////////////////////////////////////////////////////////////
  78. // Map
  79. ////////////////////////////////////////////////////////////
  80. export var createMap = function createMap(AMap, dom, options, events) {
  81. var __func__ = 'createMap';
  82. if (!AMap) {
  83. console.log(__func__, 'fail! no AMap!');
  84. return null;
  85. }
  86. if (!dom) {
  87. console.log(__func__, 'fail! no dom!');
  88. return null;
  89. }
  90. var map = new AMap.Map(dom, _extends({}, options || {}));
  91. forOwn(events, function (value, key) {
  92. console.log(__func__, 'event on ' + key);
  93. map.on(key, value);
  94. });
  95. console.log(__func__, 'ok!');
  96. return map;
  97. };
  98. export var commonUpdate = function commonUpdate(entity, newOptions, newEvents, oldOptions, oldEvents, operators) {
  99. var __func__ = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : 'commonUpdate';
  100. // const __func__ = 'commonUpdate';
  101. if (!entity) {
  102. console.log(__func__, 'fail! no entity!');
  103. return false;
  104. }
  105. // 找到改变的属性集合,包含添加,删除及修改的属性,删除的置为null
  106. var props = {};
  107. if (newOptions != oldOptions) {
  108. oldOptions && forOwn(oldOptions, function (value, key) {
  109. // 找到改变的旧属性,用新属性取代
  110. var newValue = newOptions && newOptions[key];
  111. if (!isEqual(newValue, value)) {
  112. if (!(isNil(newValue) && isNil(value))) props[key] = newValue;
  113. }
  114. });
  115. newOptions && forOwn(newOptions, function (value, key) {
  116. // 找到新加的属性,添加进去
  117. var oldValue = oldOptions && oldOptions[key];
  118. if (isNil(oldValue) && !isNil(value)) {
  119. props[key] = value;
  120. }
  121. });
  122. }
  123. // 找到改变的事件集合,包含添加,删除及修改的事件处理函数,删除的置为null
  124. var events = {};
  125. if (newEvents != oldEvents) {
  126. oldEvents && forOwn(oldEvents, function (value, key) {
  127. // 找到改变的旧属性,用新属性取代
  128. var newValue = newEvents && newEvents[key];
  129. if (!isEqual(newValue, value)) {
  130. if (!(isNil(newValue) && isNil(value))) events[key] = newValue;
  131. }
  132. });
  133. newEvents && forOwn(newEvents, function (value, key) {
  134. // 找到新加的属性,添加进去
  135. var oldValue = oldEvents && oldEvents[key];
  136. if (isNil(oldValue) && !isNil(value)) {
  137. events[key] = value;
  138. }
  139. });
  140. }
  141. // let operators = {
  142. // map: v => entity.setMap(v),
  143. // position: v => entity.setPosition(v),
  144. // offset: v => entity.setOffset(v),
  145. // icon: v => entity.setIcon(v),
  146. // content: v => entity.setContent(v),
  147. // topWhenClick: null,
  148. // bubble: null,
  149. // draggable: v => entity.setDraggable(v),
  150. // raiseOnDrag: null,
  151. // cursor: v => entity.setCursor(v),
  152. // visible: null,
  153. // zIndex: v => entity.setzIndex(v),
  154. // angle: v => entity.setAngle(v),
  155. // autoRotation: null,
  156. // animation: v => entity.setAnimation(v),
  157. // shadow: v => entity.setShadow(v),
  158. // title: v => entity.setTitle(v),
  159. // clickable: v => entity.setClickable(v),
  160. // shape: v => entity.setShape(v),
  161. // extData: v => entity.setExtData(v),
  162. // label: v => entity.setLabel(v)
  163. // };
  164. forOwn(props, function (value, key) {
  165. if (value) {
  166. var func = operators[key];
  167. if (func) {
  168. func(value);
  169. } else {
  170. // ignore properties can not set.
  171. console.log(__func__, 'warning! no setter! can not update ' + key);
  172. }
  173. } else {
  174. // key removed, not support!
  175. console.log(__func__, 'warning! remove prop not support! key=' + key);
  176. }
  177. });
  178. forOwn(events, function (value, key) {
  179. var oldFunc = oldEvents && oldEvents[key];
  180. if (oldFunc) {
  181. entity.off(key, oldFunc);
  182. }
  183. if (value) {
  184. entity.on(key, value);
  185. }
  186. });
  187. if (!isEmpty(props) || !isEmpty(events)) {
  188. console.log(__func__, 'update:', props, events
  189. // newOptions,
  190. // newEvents,
  191. // oldOptions,
  192. // oldEvents
  193. );
  194. }
  195. return true;
  196. };
  197. export var updateMap = function updateMap(map, newOptions, newEvents, oldOptions, oldEvents) {
  198. var operators = {
  199. view: null,
  200. layers: function layers(v) {
  201. return map.setLayers(v);
  202. },
  203. zoom: function zoom(v) {
  204. return map.setZoom(v);
  205. },
  206. center: function center(v) {
  207. return map.setCenter(v);
  208. },
  209. labelzIndex: function labelzIndex(v) {
  210. return map.setlabelzIndex(v);
  211. },
  212. zooms: null,
  213. lang: function lang(v) {
  214. return map.setLang(v);
  215. },
  216. defaultCursor: function defaultCursor(v) {
  217. return map.setDefaultCursor(v);
  218. },
  219. crs: null,
  220. animateEnable: null,
  221. isHotspot: function isHotspot(v) {
  222. return map.setStatus({ isHotspot: v });
  223. },
  224. defaultLayer: function defaultLayer(v) {
  225. return map.setDefaultLayer(v);
  226. },
  227. rotateEnable: null,
  228. resizeEnable: null,
  229. showIndoorMap: null,
  230. indoorMap: null,
  231. expandZoomRange: null,
  232. dragEnable: function dragEnable(v) {
  233. return map.setStatus({ dragEnable: v });
  234. },
  235. zoomEnable: null,
  236. doubleClickZoom: function doubleClickZoom(v) {
  237. return map.setStatus({ doubleClickZoom: v });
  238. },
  239. keyboardEnable: function keyboardEnable(v) {
  240. return map.setStatus({ keyboardEnable: v });
  241. },
  242. jogEnable: null,
  243. scrollWheel: null,
  244. touchZoom: null,
  245. touchZoomCenter: null,
  246. mapStyle: function mapStyle(v) {
  247. return map.setMapStyle(v);
  248. },
  249. features: function features(v) {
  250. return map.setFeatures(v);
  251. },
  252. showBuildingBlock: null,
  253. viewMode: null,
  254. pitch: function pitch(v) {
  255. return map.setPitch(v);
  256. },
  257. pitchEnable: null,
  258. buildAnimation: null,
  259. skyColor: null,
  260. preloadMode: null
  261. };
  262. return commonUpdate(map, newOptions, newEvents, oldOptions, oldEvents, operators, 'updateMap');
  263. };
  264. ////////////////////////////////////////////////////////////
  265. // Marker
  266. ////////////////////////////////////////////////////////////
  267. /**
  268. *
  269. * @param {*} AMap
  270. * @param {*} map
  271. * @param {*} options 如果有dom用来显示,则其中的content字段即被填充为dom,不再用独立参数表示dom
  272. * @param {*} events
  273. */
  274. export var createMarker = function createMarker(AMap, options, events) {
  275. var __func__ = 'createMarker';
  276. if (!AMap) {
  277. console.log(__func__, 'fail! no AMap!');
  278. return null;
  279. }
  280. if (!options) {
  281. console.log(__func__, 'fail! no options!');
  282. return null;
  283. }
  284. if (!options.map) {
  285. console.log(__func__, 'fail! no options.map!');
  286. return null;
  287. }
  288. // let marker = new AMap.Marker({
  289. // icon: "https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
  290. // position: [116.405467, 39.907761]
  291. // });
  292. // marker.setMap(map);
  293. var entity = new AMap.Marker(options);
  294. forOwn(events, function (value, key) {
  295. entity.on(key, value);
  296. });
  297. console.log(__func__, 'ok!');
  298. return entity;
  299. };
  300. export var updateMarker = function updateMarker(entity, newOptions, newEvents, oldOptions, oldEvents) {
  301. var operators = {
  302. map: function map(v) {
  303. return entity.setMap(v);
  304. },
  305. position: function position(v) {
  306. return entity.setPosition(v);
  307. },
  308. offset: function offset(v) {
  309. return entity.setOffset(v);
  310. },
  311. icon: function icon(v) {
  312. return entity.setIcon(v);
  313. },
  314. content: function content(v) {
  315. return entity.setContent(v);
  316. },
  317. topWhenClick: null,
  318. bubble: null,
  319. draggable: function draggable(v) {
  320. return entity.setDraggable(v);
  321. },
  322. raiseOnDrag: null,
  323. cursor: function cursor(v) {
  324. return entity.setCursor(v);
  325. },
  326. visible: null,
  327. zIndex: function zIndex(v) {
  328. return entity.setzIndex(v);
  329. },
  330. angle: function angle(v) {
  331. return entity.setAngle(v);
  332. },
  333. autoRotation: null,
  334. animation: function animation(v) {
  335. return entity.setAnimation(v);
  336. },
  337. shadow: function shadow(v) {
  338. return entity.setShadow(v);
  339. },
  340. title: function title(v) {
  341. return entity.setTitle(v);
  342. },
  343. clickable: function clickable(v) {
  344. return entity.setClickable(v);
  345. },
  346. shape: function shape(v) {
  347. return entity.setShape(v);
  348. },
  349. extData: function extData(v) {
  350. return entity.setExtData(v);
  351. },
  352. label: function label(v) {
  353. return entity.setLabel(v);
  354. }
  355. };
  356. return commonUpdate(entity, newOptions, newEvents, oldOptions, oldEvents, operators, 'updateMarker');
  357. };
  358. ////////////////////////////////////////////////////////////
  359. // MassMarks, warning! is a layer!
  360. ////////////////////////////////////////////////////////////
  361. /**
  362. *
  363. * @param {*} AMap
  364. * @param {*} map
  365. * @param {*} options 如果有dom用来显示,则其中的content字段即被填充为dom,不再用独立参数表示dom
  366. * @param {*} events
  367. */
  368. var createMassMarks = function createMassMarks(AMap, options, events) {
  369. var __func__ = 'createMassMarks';
  370. if (!AMap) {
  371. console.log(__func__, 'fail! no AMap!');
  372. return null;
  373. }
  374. if (!options) {
  375. console.log(__func__, 'fail! no options!');
  376. return null;
  377. }
  378. var map = options.map,
  379. data = options.data,
  380. restOpts = _objectWithoutProperties(options, ['map', 'data']);
  381. var entity = new AMap.MassMarks(data, restOpts);
  382. forOwn(events, function (value, key) {
  383. entity.on(key, value);
  384. });
  385. if (map) {
  386. entity.setMap(map);
  387. }
  388. console.log(__func__, 'ok!');
  389. return entity;
  390. };
  391. export { createMassMarks };
  392. export var updateMassMarks = function updateMassMarks(entity, newOptions, newEvents, oldOptions, oldEvents) {
  393. var operators = {
  394. zIndex: function zIndex(v) {
  395. return entity.setzIndex(v);
  396. },
  397. opacity: null,
  398. zooms: null,
  399. cursor: function cursor(v) {
  400. return entity.setCursor(v);
  401. },
  402. alwaysRender: null,
  403. style: function style(v) {
  404. return entity.setStyle(v);
  405. },
  406. map: function map(v) {
  407. return entity.setMap(v);
  408. },
  409. data: function data(v) {
  410. return entity.setData(v);
  411. }
  412. };
  413. return commonUpdate(entity, newOptions, newEvents, oldOptions, oldEvents, operators, 'updateMassMarks');
  414. };
  415. ////////////////////////////////////////////////////////////
  416. // Polygon
  417. ////////////////////////////////////////////////////////////
  418. /**
  419. *
  420. * @param {*} AMap
  421. * @param {*} map
  422. * @param {*} options 如果有dom用来显示,则其中的content字段即被填充为dom,不再用独立参数表示dom
  423. * @param {*} events
  424. */
  425. export var createPolygon = function createPolygon(AMap, options, events) {
  426. var __func__ = 'createPolygon';
  427. if (!AMap) {
  428. console.log(__func__, 'fail! no AMap!');
  429. return null;
  430. }
  431. if (!options) {
  432. console.log(__func__, 'fail! no options!');
  433. return null;
  434. }
  435. if (!options.map) {
  436. console.log(__func__, 'fail! no options.map!');
  437. return null;
  438. }
  439. var entity = new AMap.Polygon(options);
  440. forOwn(events, function (value, key) {
  441. entity.on(key, value);
  442. });
  443. console.log(__func__, 'ok!');
  444. return entity;
  445. };
  446. export var updatePolygon = function updatePolygon(entity, newOptions, newEvents, oldOptions, oldEvents) {
  447. var operators = {
  448. map: function map(v) {
  449. return entity.setMap(v);
  450. },
  451. zIndex: function zIndex(v) {
  452. return entity.setzIndex(v);
  453. },
  454. path: function path(v) {
  455. return entity.setPath(v);
  456. },
  457. bubble: null,
  458. cursor: null,
  459. strokeColor: null,
  460. strokeOpacity: null,
  461. strokeWeight: null,
  462. fillColor: null,
  463. fillOpacity: null,
  464. draggable: null,
  465. extData: function extData(v) {
  466. return entity.setExtData(v);
  467. },
  468. strokeStyle: null,
  469. strokeDasharray: null,
  470. options: function options(v) {
  471. return entity.setOptions(v);
  472. }
  473. };
  474. return commonUpdate(entity, newOptions, newEvents, oldOptions, oldEvents, operators, 'updatePolygon');
  475. };
  476. ////////////////////////////////////////////////////////////
  477. // Polyline
  478. ////////////////////////////////////////////////////////////
  479. /**
  480. *
  481. * @param {*} AMap
  482. * @param {*} map
  483. * @param {*} options 如果有dom用来显示,则其中的content字段即被填充为dom,不再用独立参数表示dom
  484. * @param {*} events
  485. */
  486. export var createPolyline = function createPolyline(AMap, options, events) {
  487. var __func__ = 'createPolyline';
  488. if (!AMap) {
  489. console.log(__func__, 'fail! no AMap!');
  490. return null;
  491. }
  492. if (!options) {
  493. console.log(__func__, 'fail! no options!');
  494. return null;
  495. }
  496. if (!options.map) {
  497. console.log(__func__, 'fail! no options.map!');
  498. return null;
  499. }
  500. var entity = new AMap.Polyline(options);
  501. forOwn(events, function (value, key) {
  502. entity.on(key, value);
  503. });
  504. console.log(__func__, 'ok!');
  505. return entity;
  506. };
  507. export var updatePolyline = function updatePolyline(entity, newOptions, newEvents, oldOptions, oldEvents) {
  508. var operators = {
  509. map: function map(v) {
  510. return entity.setMap(v);
  511. },
  512. zIndex: function zIndex(v) {
  513. return entity.setzIndex(v);
  514. },
  515. bubble: null,
  516. cursor: null,
  517. gedodesic: null,
  518. isOutline: null,
  519. borderWeight: null,
  520. outlineColor: null,
  521. path: function path(v) {
  522. return entity.setPath(v);
  523. },
  524. strokeColor: null,
  525. strokeOpacity: null,
  526. strokeWeight: null,
  527. strokeStyle: null,
  528. strokeDasharray: null,
  529. lineJoin: null,
  530. lineCap: null,
  531. draggable: null,
  532. extData: function extData(v) {
  533. return entity.setExtData(v);
  534. },
  535. showDir: null,
  536. options: function options(v) {
  537. return entity.setOptions(v);
  538. }
  539. };
  540. return commonUpdate(entity, newOptions, newEvents, oldOptions, oldEvents, operators, 'updatePolyline');
  541. };