map.js 21 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557
  1. "use strict";
  2. var __extends = (this && this.__extends) || (function () {
  3. var extendStatics = Object.setPrototypeOf ||
  4. ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
  5. function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
  6. return function (d, b) {
  7. extendStatics(d, b);
  8. function __() { this.constructor = d; }
  9. d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
  10. };
  11. })();
  12. /*!
  13. * devextreme-angular
  14. * Version: 19.1.16
  15. * Build date: Tue Oct 18 2022
  16. *
  17. * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  18. *
  19. * This software may be modified and distributed under the terms
  20. * of the MIT license. See the LICENSE file in the root of the project for details.
  21. *
  22. * https://github.com/DevExpress/devextreme-angular
  23. */
  24. Object.defineProperty(exports, "__esModule", { value: true });
  25. var platform_browser_1 = require("@angular/platform-browser");
  26. var platform_browser_2 = require("@angular/platform-browser");
  27. var core_1 = require("@angular/core");
  28. var map_1 = require("devextreme/ui/map");
  29. var component_1 = require("../core/component");
  30. var template_host_1 = require("../core/template-host");
  31. var integration_1 = require("../core/integration");
  32. var template_1 = require("../core/template");
  33. var nested_option_1 = require("../core/nested-option");
  34. var watcher_helper_1 = require("../core/watcher-helper");
  35. var iterable_differ_helper_1 = require("../core/iterable-differ-helper");
  36. var center_dxi_1 = require("./nested/center-dxi");
  37. var key_1 = require("./nested/key");
  38. var marker_dxi_1 = require("./nested/marker-dxi");
  39. var location_dxi_1 = require("./nested/location-dxi");
  40. var tooltip_1 = require("./nested/tooltip");
  41. var route_dxi_1 = require("./nested/route-dxi");
  42. var center_dxi_2 = require("./nested/center-dxi");
  43. var marker_dxi_2 = require("./nested/marker-dxi");
  44. var route_dxi_2 = require("./nested/route-dxi");
  45. /**
  46. * The Map is an interactive widget that displays a geographic map with markers and routes.
  47. */
  48. var DxMapComponent = (function (_super) {
  49. __extends(DxMapComponent, _super);
  50. function DxMapComponent(elementRef, ngZone, templateHost, _watcherHelper, _idh, optionHost, transferState, platformId) {
  51. var _this = _super.call(this, elementRef, ngZone, templateHost, _watcherHelper, transferState, platformId) || this;
  52. _this._watcherHelper = _watcherHelper;
  53. _this._idh = _idh;
  54. _this._createEventEmitters([
  55. { subscribe: 'click', emit: 'onClick' },
  56. { subscribe: 'disposing', emit: 'onDisposing' },
  57. { subscribe: 'initialized', emit: 'onInitialized' },
  58. { subscribe: 'markerAdded', emit: 'onMarkerAdded' },
  59. { subscribe: 'markerRemoved', emit: 'onMarkerRemoved' },
  60. { subscribe: 'optionChanged', emit: 'onOptionChanged' },
  61. { subscribe: 'ready', emit: 'onReady' },
  62. { subscribe: 'routeAdded', emit: 'onRouteAdded' },
  63. { subscribe: 'routeRemoved', emit: 'onRouteRemoved' },
  64. { emit: 'accessKeyChange' },
  65. { emit: 'activeStateEnabledChange' },
  66. { emit: 'autoAdjustChange' },
  67. { emit: 'centerChange' },
  68. { emit: 'controlsChange' },
  69. { emit: 'disabledChange' },
  70. { emit: 'elementAttrChange' },
  71. { emit: 'focusStateEnabledChange' },
  72. { emit: 'heightChange' },
  73. { emit: 'hintChange' },
  74. { emit: 'hoverStateEnabledChange' },
  75. { emit: 'keyChange' },
  76. { emit: 'markerIconSrcChange' },
  77. { emit: 'markersChange' },
  78. { emit: 'providerChange' },
  79. { emit: 'routesChange' },
  80. { emit: 'rtlEnabledChange' },
  81. { emit: 'tabIndexChange' },
  82. { emit: 'typeChange' },
  83. { emit: 'visibleChange' },
  84. { emit: 'widthChange' },
  85. { emit: 'zoomChange' }
  86. ]);
  87. _this._idh.setHost(_this);
  88. optionHost.setHost(_this);
  89. return _this;
  90. }
  91. Object.defineProperty(DxMapComponent.prototype, "accessKey", {
  92. get: /**
  93. * Specifies the shortcut key that sets focus on the widget.
  94. */
  95. function () {
  96. return this._getOption('accessKey');
  97. },
  98. set: function (value) {
  99. this._setOption('accessKey', value);
  100. },
  101. enumerable: true,
  102. configurable: true
  103. });
  104. Object.defineProperty(DxMapComponent.prototype, "activeStateEnabled", {
  105. get: /**
  106. * Specifies whether or not the widget changes its state when interacting with a user.
  107. */
  108. function () {
  109. return this._getOption('activeStateEnabled');
  110. },
  111. set: function (value) {
  112. this._setOption('activeStateEnabled', value);
  113. },
  114. enumerable: true,
  115. configurable: true
  116. });
  117. Object.defineProperty(DxMapComponent.prototype, "autoAdjust", {
  118. get: /**
  119. * Specifies whether the widget automatically adjusts center and zoom option values when adding a new marker or route, or if a new widget contains markers or routes by default.
  120. */
  121. function () {
  122. return this._getOption('autoAdjust');
  123. },
  124. set: function (value) {
  125. this._setOption('autoAdjust', value);
  126. },
  127. enumerable: true,
  128. configurable: true
  129. });
  130. Object.defineProperty(DxMapComponent.prototype, "center", {
  131. get: /**
  132. * An object, a string, or an array specifying which part of the map is displayed at the widget's center using coordinates. The widget can change this value if autoAdjust is enabled.
  133. */
  134. function () {
  135. return this._getOption('center');
  136. },
  137. set: function (value) {
  138. this._setOption('center', value);
  139. },
  140. enumerable: true,
  141. configurable: true
  142. });
  143. Object.defineProperty(DxMapComponent.prototype, "controls", {
  144. get: /**
  145. * Specifies whether or not map widget controls are available.
  146. */
  147. function () {
  148. return this._getOption('controls');
  149. },
  150. set: function (value) {
  151. this._setOption('controls', value);
  152. },
  153. enumerable: true,
  154. configurable: true
  155. });
  156. Object.defineProperty(DxMapComponent.prototype, "disabled", {
  157. get: /**
  158. * Specifies whether the widget responds to user interaction.
  159. */
  160. function () {
  161. return this._getOption('disabled');
  162. },
  163. set: function (value) {
  164. this._setOption('disabled', value);
  165. },
  166. enumerable: true,
  167. configurable: true
  168. });
  169. Object.defineProperty(DxMapComponent.prototype, "elementAttr", {
  170. get: /**
  171. * Specifies the attributes to be attached to the widget's root element.
  172. */
  173. function () {
  174. return this._getOption('elementAttr');
  175. },
  176. set: function (value) {
  177. this._setOption('elementAttr', value);
  178. },
  179. enumerable: true,
  180. configurable: true
  181. });
  182. Object.defineProperty(DxMapComponent.prototype, "focusStateEnabled", {
  183. get: /**
  184. * Specifies whether the widget can be focused using keyboard navigation.
  185. */
  186. function () {
  187. return this._getOption('focusStateEnabled');
  188. },
  189. set: function (value) {
  190. this._setOption('focusStateEnabled', value);
  191. },
  192. enumerable: true,
  193. configurable: true
  194. });
  195. Object.defineProperty(DxMapComponent.prototype, "height", {
  196. get: /**
  197. * Specifies the widget's height.
  198. */
  199. function () {
  200. return this._getOption('height');
  201. },
  202. set: function (value) {
  203. this._setOption('height', value);
  204. },
  205. enumerable: true,
  206. configurable: true
  207. });
  208. Object.defineProperty(DxMapComponent.prototype, "hint", {
  209. get: /**
  210. * Specifies text for a hint that appears when a user pauses on the widget.
  211. */
  212. function () {
  213. return this._getOption('hint');
  214. },
  215. set: function (value) {
  216. this._setOption('hint', value);
  217. },
  218. enumerable: true,
  219. configurable: true
  220. });
  221. Object.defineProperty(DxMapComponent.prototype, "hoverStateEnabled", {
  222. get: /**
  223. * Specifies whether the widget changes its state when a user pauses on it.
  224. */
  225. function () {
  226. return this._getOption('hoverStateEnabled');
  227. },
  228. set: function (value) {
  229. this._setOption('hoverStateEnabled', value);
  230. },
  231. enumerable: true,
  232. configurable: true
  233. });
  234. Object.defineProperty(DxMapComponent.prototype, "key", {
  235. get: /**
  236. * A key used to authenticate the application within the required map provider.
  237. */
  238. function () {
  239. return this._getOption('key');
  240. },
  241. set: function (value) {
  242. this._setOption('key', value);
  243. },
  244. enumerable: true,
  245. configurable: true
  246. });
  247. Object.defineProperty(DxMapComponent.prototype, "markerIconSrc", {
  248. get: /**
  249. * A URL pointing to the custom icon to be used for map markers.
  250. */
  251. function () {
  252. return this._getOption('markerIconSrc');
  253. },
  254. set: function (value) {
  255. this._setOption('markerIconSrc', value);
  256. },
  257. enumerable: true,
  258. configurable: true
  259. });
  260. Object.defineProperty(DxMapComponent.prototype, "markers", {
  261. get: /**
  262. * An array of markers displayed on a map.
  263. */
  264. function () {
  265. return this._getOption('markers');
  266. },
  267. set: function (value) {
  268. this._setOption('markers', value);
  269. },
  270. enumerable: true,
  271. configurable: true
  272. });
  273. Object.defineProperty(DxMapComponent.prototype, "provider", {
  274. get: /**
  275. * The name of the current map data provider.
  276. */
  277. function () {
  278. return this._getOption('provider');
  279. },
  280. set: function (value) {
  281. this._setOption('provider', value);
  282. },
  283. enumerable: true,
  284. configurable: true
  285. });
  286. Object.defineProperty(DxMapComponent.prototype, "routes", {
  287. get: /**
  288. * An array of routes shown on the map.
  289. */
  290. function () {
  291. return this._getOption('routes');
  292. },
  293. set: function (value) {
  294. this._setOption('routes', value);
  295. },
  296. enumerable: true,
  297. configurable: true
  298. });
  299. Object.defineProperty(DxMapComponent.prototype, "rtlEnabled", {
  300. get: /**
  301. * Switches the widget to a right-to-left representation.
  302. */
  303. function () {
  304. return this._getOption('rtlEnabled');
  305. },
  306. set: function (value) {
  307. this._setOption('rtlEnabled', value);
  308. },
  309. enumerable: true,
  310. configurable: true
  311. });
  312. Object.defineProperty(DxMapComponent.prototype, "tabIndex", {
  313. get: /**
  314. * Specifies the number of the element when the Tab key is used for navigating.
  315. */
  316. function () {
  317. return this._getOption('tabIndex');
  318. },
  319. set: function (value) {
  320. this._setOption('tabIndex', value);
  321. },
  322. enumerable: true,
  323. configurable: true
  324. });
  325. Object.defineProperty(DxMapComponent.prototype, "type", {
  326. get: /**
  327. * The type of a map to display.
  328. */
  329. function () {
  330. return this._getOption('type');
  331. },
  332. set: function (value) {
  333. this._setOption('type', value);
  334. },
  335. enumerable: true,
  336. configurable: true
  337. });
  338. Object.defineProperty(DxMapComponent.prototype, "visible", {
  339. get: /**
  340. * Specifies whether the widget is visible.
  341. */
  342. function () {
  343. return this._getOption('visible');
  344. },
  345. set: function (value) {
  346. this._setOption('visible', value);
  347. },
  348. enumerable: true,
  349. configurable: true
  350. });
  351. Object.defineProperty(DxMapComponent.prototype, "width", {
  352. get: /**
  353. * Specifies the widget's width.
  354. */
  355. function () {
  356. return this._getOption('width');
  357. },
  358. set: function (value) {
  359. this._setOption('width', value);
  360. },
  361. enumerable: true,
  362. configurable: true
  363. });
  364. Object.defineProperty(DxMapComponent.prototype, "zoom", {
  365. get: /**
  366. * The map's zoom level. The widget can change this value if autoAdjust is enabled.
  367. */
  368. function () {
  369. return this._getOption('zoom');
  370. },
  371. set: function (value) {
  372. this._setOption('zoom', value);
  373. },
  374. enumerable: true,
  375. configurable: true
  376. });
  377. Object.defineProperty(DxMapComponent.prototype, "centerChildren", {
  378. get: function () {
  379. return this._getOption('center');
  380. },
  381. set: function (value) {
  382. this.setChildren('center', value);
  383. },
  384. enumerable: true,
  385. configurable: true
  386. });
  387. Object.defineProperty(DxMapComponent.prototype, "markersChildren", {
  388. get: function () {
  389. return this._getOption('markers');
  390. },
  391. set: function (value) {
  392. this.setChildren('markers', value);
  393. },
  394. enumerable: true,
  395. configurable: true
  396. });
  397. Object.defineProperty(DxMapComponent.prototype, "routesChildren", {
  398. get: function () {
  399. return this._getOption('routes');
  400. },
  401. set: function (value) {
  402. this.setChildren('routes', value);
  403. },
  404. enumerable: true,
  405. configurable: true
  406. });
  407. DxMapComponent.prototype._createInstance = function (element, options) {
  408. return new map_1.default(element, options);
  409. };
  410. DxMapComponent.prototype.ngOnDestroy = function () {
  411. this._destroyWidget();
  412. };
  413. DxMapComponent.prototype.ngOnChanges = function (changes) {
  414. _super.prototype.ngOnChanges.call(this, changes);
  415. this.setupChanges('center', changes);
  416. this.setupChanges('markers', changes);
  417. this.setupChanges('routes', changes);
  418. };
  419. DxMapComponent.prototype.setupChanges = function (prop, changes) {
  420. if (!(prop in this._optionsToUpdate)) {
  421. this._idh.setup(prop, changes);
  422. }
  423. };
  424. DxMapComponent.prototype.ngDoCheck = function () {
  425. this._idh.doCheck('center');
  426. this._idh.doCheck('markers');
  427. this._idh.doCheck('routes');
  428. this._watcherHelper.checkWatchers();
  429. _super.prototype.ngDoCheck.call(this);
  430. _super.prototype.clearChangedOptions.call(this);
  431. };
  432. DxMapComponent.prototype._setOption = function (name, value) {
  433. var isSetup = this._idh.setupSingle(name, value);
  434. var isChanged = this._idh.getChanges(name, value) !== null;
  435. if (isSetup || isChanged) {
  436. _super.prototype._setOption.call(this, name, value);
  437. }
  438. };
  439. DxMapComponent.decorators = [
  440. { type: core_1.Component, args: [{
  441. selector: 'dx-map',
  442. template: '',
  443. providers: [
  444. template_host_1.DxTemplateHost,
  445. watcher_helper_1.WatcherHelper,
  446. nested_option_1.NestedOptionHost,
  447. iterable_differ_helper_1.IterableDifferHelper
  448. ]
  449. },] },
  450. ];
  451. /** @nocollapse */
  452. DxMapComponent.ctorParameters = function () { return [
  453. { type: core_1.ElementRef, },
  454. { type: core_1.NgZone, },
  455. { type: template_host_1.DxTemplateHost, },
  456. { type: watcher_helper_1.WatcherHelper, },
  457. { type: iterable_differ_helper_1.IterableDifferHelper, },
  458. { type: nested_option_1.NestedOptionHost, },
  459. { type: platform_browser_2.TransferState, },
  460. { type: undefined, decorators: [{ type: core_1.Inject, args: [core_1.PLATFORM_ID,] },] },
  461. ]; };
  462. DxMapComponent.propDecorators = {
  463. "accessKey": [{ type: core_1.Input },],
  464. "activeStateEnabled": [{ type: core_1.Input },],
  465. "autoAdjust": [{ type: core_1.Input },],
  466. "center": [{ type: core_1.Input },],
  467. "controls": [{ type: core_1.Input },],
  468. "disabled": [{ type: core_1.Input },],
  469. "elementAttr": [{ type: core_1.Input },],
  470. "focusStateEnabled": [{ type: core_1.Input },],
  471. "height": [{ type: core_1.Input },],
  472. "hint": [{ type: core_1.Input },],
  473. "hoverStateEnabled": [{ type: core_1.Input },],
  474. "key": [{ type: core_1.Input },],
  475. "markerIconSrc": [{ type: core_1.Input },],
  476. "markers": [{ type: core_1.Input },],
  477. "provider": [{ type: core_1.Input },],
  478. "routes": [{ type: core_1.Input },],
  479. "rtlEnabled": [{ type: core_1.Input },],
  480. "tabIndex": [{ type: core_1.Input },],
  481. "type": [{ type: core_1.Input },],
  482. "visible": [{ type: core_1.Input },],
  483. "width": [{ type: core_1.Input },],
  484. "zoom": [{ type: core_1.Input },],
  485. "onClick": [{ type: core_1.Output },],
  486. "onDisposing": [{ type: core_1.Output },],
  487. "onInitialized": [{ type: core_1.Output },],
  488. "onMarkerAdded": [{ type: core_1.Output },],
  489. "onMarkerRemoved": [{ type: core_1.Output },],
  490. "onOptionChanged": [{ type: core_1.Output },],
  491. "onReady": [{ type: core_1.Output },],
  492. "onRouteAdded": [{ type: core_1.Output },],
  493. "onRouteRemoved": [{ type: core_1.Output },],
  494. "accessKeyChange": [{ type: core_1.Output },],
  495. "activeStateEnabledChange": [{ type: core_1.Output },],
  496. "autoAdjustChange": [{ type: core_1.Output },],
  497. "centerChange": [{ type: core_1.Output },],
  498. "controlsChange": [{ type: core_1.Output },],
  499. "disabledChange": [{ type: core_1.Output },],
  500. "elementAttrChange": [{ type: core_1.Output },],
  501. "focusStateEnabledChange": [{ type: core_1.Output },],
  502. "heightChange": [{ type: core_1.Output },],
  503. "hintChange": [{ type: core_1.Output },],
  504. "hoverStateEnabledChange": [{ type: core_1.Output },],
  505. "keyChange": [{ type: core_1.Output },],
  506. "markerIconSrcChange": [{ type: core_1.Output },],
  507. "markersChange": [{ type: core_1.Output },],
  508. "providerChange": [{ type: core_1.Output },],
  509. "routesChange": [{ type: core_1.Output },],
  510. "rtlEnabledChange": [{ type: core_1.Output },],
  511. "tabIndexChange": [{ type: core_1.Output },],
  512. "typeChange": [{ type: core_1.Output },],
  513. "visibleChange": [{ type: core_1.Output },],
  514. "widthChange": [{ type: core_1.Output },],
  515. "zoomChange": [{ type: core_1.Output },],
  516. "centerChildren": [{ type: core_1.ContentChildren, args: [center_dxi_2.DxiCenterComponent,] },],
  517. "markersChildren": [{ type: core_1.ContentChildren, args: [marker_dxi_2.DxiMarkerComponent,] },],
  518. "routesChildren": [{ type: core_1.ContentChildren, args: [route_dxi_2.DxiRouteComponent,] },],
  519. };
  520. return DxMapComponent;
  521. }(component_1.DxComponent));
  522. exports.DxMapComponent = DxMapComponent;
  523. var DxMapModule = (function () {
  524. function DxMapModule() {
  525. }
  526. DxMapModule.decorators = [
  527. { type: core_1.NgModule, args: [{
  528. imports: [
  529. center_dxi_1.DxiCenterModule,
  530. key_1.DxoKeyModule,
  531. marker_dxi_1.DxiMarkerModule,
  532. location_dxi_1.DxiLocationModule,
  533. tooltip_1.DxoTooltipModule,
  534. route_dxi_1.DxiRouteModule,
  535. integration_1.DxIntegrationModule,
  536. template_1.DxTemplateModule,
  537. platform_browser_1.BrowserTransferStateModule
  538. ],
  539. declarations: [
  540. DxMapComponent
  541. ],
  542. exports: [
  543. DxMapComponent,
  544. center_dxi_1.DxiCenterModule,
  545. key_1.DxoKeyModule,
  546. marker_dxi_1.DxiMarkerModule,
  547. location_dxi_1.DxiLocationModule,
  548. tooltip_1.DxoTooltipModule,
  549. route_dxi_1.DxiRouteModule,
  550. template_1.DxTemplateModule
  551. ]
  552. },] },
  553. ];
  554. return DxMapModule;
  555. }());
  556. exports.DxMapModule = DxMapModule;
  557. //# sourceMappingURL=map.js.map