Commit 814ac34a authored by seyed.takyar's avatar seyed.takyar
Browse files

A map editor pop up is developed to update the layer URL on the esri map

parent dae60b3c
Pipeline #136704 failed with stage
in 3 minutes
......@@ -107,6 +107,7 @@
"src/styles.scss",
"node_modules/primeicons/primeicons.css",
"node_modules/primeng/resources/themes/saga-blue/theme.css",
"node_modules/primeng/resources/primeng.min.css"
],
"scripts": ["node_modules/chart.js/dist/Chart.js"]
......
......@@ -501,48 +501,40 @@
}
},
"@arcgis/core": {
"version": "4.22.2",
"resolved": "https://registry.npmjs.org/@arcgis/core/-/core-4.22.2.tgz",
"integrity": "sha512-twx50yjKsMoeotgQfnYHmm4EIS57fC9rWNNrvGc2xERVUOY7p2fFPs2qemdyFnCmvrRNflZcnZkxrTZXeDCtow==",
"version": "4.23.7",
"resolved": "https://registry.npmjs.org/@arcgis/core/-/core-4.23.7.tgz",
"integrity": "sha512-xi3eBV513CmoHQ6F1OurEt71aBt4FzDOaOrPKzsFVJnq0LeDPKUHfsBs4E8BoGLSk5df+gDCZG+WHTmzxu8c0w==",
"requires": {
"@esri/arcgis-html-sanitizer": "~2.9.0-next.1",
"@esri/arcgis-html-sanitizer": "~2.9.0",
"@esri/calcite-colors": "~6.0.1",
"@esri/calcite-components": "1.0.0-beta.69",
"@popperjs/core": "~2.10.2",
"focus-trap": "~6.7.1",
"luxon": "~2.1.1",
"moment": "~2.29.1",
"@esri/calcite-components": "1.0.0-beta.77",
"@popperjs/core": "~2.11.4",
"focus-trap": "~6.7.3",
"luxon": "~2.3.1",
"sortablejs": "~1.14.0"
}
},
"@auth0/auth0-angular": {
"version": "1.8.2",
"resolved": "https://registry.npmjs.org/@auth0/auth0-angular/-/auth0-angular-1.8.2.tgz",
"integrity": "sha512-4SQI+nk6VSsmRe7V7RXWRq1JeV9LTpIVXInNNnRgwTGwaSFOW7d17Svs4KWwgUYBCKDg1lH2jmKMjSSOyQHvxg==",
"version": "1.9.0",
"resolved": "https://registry.npmjs.org/@auth0/auth0-angular/-/auth0-angular-1.9.0.tgz",
"integrity": "sha512-KcNeNBvk6amj0an4XTzc88yaxPy1EfNwUXSij5uDyCzNh59cR/ZbWnuk7OIj38m7Q/jSoxHHFcgnBjL2AUs2BA==",
"requires": {
"@auth0/auth0-spa-js": "^1.19.3",
"tslib": "^2.0.0"
}
},
"@auth0/auth0-spa-js": {
"version": "1.19.4",
"resolved": "https://registry.npmjs.org/@auth0/auth0-spa-js/-/auth0-spa-js-1.19.4.tgz",
"integrity": "sha512-2kcTo9DYwt79wpuZ1IkRofnTr/xAe7AvERZZ2p2hN0EpQkIEG2mMJ4tD2NfmZTZHdQOJFy2yvd+ZPkfvsXefow==",
"version": "1.21.0",
"resolved": "https://registry.npmjs.org/@auth0/auth0-spa-js/-/auth0-spa-js-1.21.0.tgz",
"integrity": "sha512-a+8+onJdOIUSEEjdIzP/BGd731DZjBn2Q0tH+v7H+bN9ldeuBOifnjPbFwQAriL+94SwkaqhoFx3L6uGDk3+vg==",
"requires": {
"abortcontroller-polyfill": "^1.7.3",
"browser-tabs-lock": "^1.2.15",
"core-js": "^3.20.0",
"core-js": "^3.20.3",
"es-cookie": "^1.3.2",
"fast-text-encoding": "^1.0.3",
"promise-polyfill": "^8.2.1",
"unfetch": "^4.2.0"
},
"dependencies": {
"core-js": {
"version": "3.20.3",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.20.3.tgz",
"integrity": "sha512-vVl8j8ph6tRS3B8qir40H7yw7voy17xL0piAjlbBUsH7WIfzoedL/ZOr1OV9FyZQLWXsayOJyV4tnRyXR85/ag=="
}
}
},
"@babel/code-frame": {
......@@ -1676,17 +1668,25 @@
"integrity": "sha512-iGUIIpeMCJSTDGw4ZsxLwwxkml0QzOUJTtysjRryGbhSt183NEtwWKS+yQO19utXQz5LbQWjoav6x6CsawElkw=="
},
"@esri/calcite-components": {
"version": "1.0.0-beta.69",
"resolved": "https://registry.npmjs.org/@esri/calcite-components/-/calcite-components-1.0.0-beta.69.tgz",
"integrity": "sha512-aBcFqNYI7T1KJyAlUtEGl/VlRJ2SyPszheRpkLG+88GnlI8nN/bMrqxXVpltkViXhx370kotdBoO4xJkWnV5pQ==",
"version": "1.0.0-beta.77",
"resolved": "https://registry.npmjs.org/@esri/calcite-components/-/calcite-components-1.0.0-beta.77.tgz",
"integrity": "sha512-fCE9ikXHzUQTHJSMXNYB1/WrPpKtQMUBbaypbbwwxM8y3ifavN0a5ns7NAC+W7uQJA+29fGpAlIMjXr/483eXw==",
"requires": {
"@a11y/focus-trap": "1.0.5",
"@popperjs/core": "2.10.2",
"@stencil/core": "2.10.0",
"@types/color": "3.0.2",
"color": "4.0.1",
"@popperjs/core": "2.11.2",
"@stencil/core": "2.13.0",
"@types/color": "3.0.3",
"color": "4.2.0",
"form-request-submit-polyfill": "2.0.0",
"lodash-es": "4.17.21",
"sortablejs": "1.14.0"
},
"dependencies": {
"@popperjs/core": {
"version": "2.11.2",
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.2.tgz",
"integrity": "sha512-92FRmppjjqz29VMJ2dn+xdyXZBrMlE42AV6Kq6BwjWV7CNUW1hs2FtxSNLQE+gJhaZ6AAmYuO9y8dshhcBl7vA=="
}
}
},
"@istanbuljs/schema": {
......@@ -1890,9 +1890,9 @@
}
},
"@popperjs/core": {
"version": "2.10.2",
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.10.2.tgz",
"integrity": "sha512-IXf3XA7+XyN7CP9gGh/XB0UxVMlvARGEgGXLubFICsUMGz6Q+DU+i4gGlpOxTjKvXjkJDJC8YdqdKkDj9qZHEQ=="
"version": "2.11.5",
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.5.tgz",
"integrity": "sha512-9X2obfABZuDVLCgPK9aX0a/x4jaOEweTTWE2+9sr0Qqqevj2Uv5XorvusThmc9XGYpS9yI+fhh8RTafBtGposw=="
},
"@ranfdev/deepobj": {
"version": "1.0.2",
......@@ -1927,9 +1927,9 @@
}
},
"@stencil/core": {
"version": "2.10.0",
"resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.10.0.tgz",
"integrity": "sha512-15rWMTPQ/sp0lSV82HVCXkIya3QLN+uBl7pqK4JnTrp4HiLrzLmNbWjbvgCs55gw0lULbCIGbRIEsFz+Pe/Q+A=="
"version": "2.13.0",
"resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.13.0.tgz",
"integrity": "sha512-EEKHOHgYpg3/iFUKMXTZJjUayRul7sXDwNw0OGgkEOe4t7JWiibDkzUHuruvpbqEydX+z1+ez5K2bMMY76c2wA=="
},
"@tootallnate/once": {
"version": "1.1.2",
......@@ -1944,14 +1944,14 @@
"dev": true
},
"@types/arcgis-js-api": {
"version": "4.22.0",
"resolved": "https://registry.npmjs.org/@types/arcgis-js-api/-/arcgis-js-api-4.22.0.tgz",
"integrity": "sha512-u9Pqy1/sxa0G5tBK/Q6TOAl8h4yIMXhCC0p8tEfRB+ZF26PGH3XPyiBOCi2yZbYbmYBO33S2nxE8UUhxrrzSsg=="
"version": "4.23.1",
"resolved": "https://registry.npmjs.org/@types/arcgis-js-api/-/arcgis-js-api-4.23.1.tgz",
"integrity": "sha512-r3lO6+rVdM6rNfD5fppqNaWWlDE/NAON9xP6EKqTDCNBh++zaE/JZVfmNu2glW4vbWp6gbbMcTTHNxCQcoDR7Q=="
},
"@types/color": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/@types/color/-/color-3.0.2.tgz",
"integrity": "sha512-INiJl6sfNn8iyC5paxVzqiVUEj2boIlFki02uRTAkKwAj++7aAF+ZfEv/XrIeBa0XI/fTZuDHW8rEEcEVnON+Q==",
"version": "3.0.3",
"resolved": "https://registry.npmjs.org/@types/color/-/color-3.0.3.tgz",
"integrity": "sha512-X//qzJ3d3Zj82J9sC/C18ZY5f43utPbAJ6PhYt/M7uG6etcF6MRpKdN880KBy43B0BMzSfeT96MzrsNjFI3GbA==",
"requires": {
"@types/color-convert": "*"
}
......@@ -2137,9 +2137,9 @@
}
},
"@types/d3-path": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/@types/d3-path/-/d3-path-2.0.1.tgz",
"integrity": "sha512-6K8LaFlztlhZO7mwsZg7ClRsdLg3FJRzIIi6SZXDWmmSJc2x8dd2VkESbLXdk3p8cuvz71f36S0y8Zv2AxqvQw=="
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/@types/d3-path/-/d3-path-2.0.2.tgz",
"integrity": "sha512-3YHpvDw9LzONaJzejXLOwZ3LqwwkoXb9LI2YN7Hbd6pkGo5nIlJ09ul4bQhBN4hQZJKmUpX8HkVqbzgUKY48cg=="
},
"@types/d3-polygon": {
"version": "2.0.1",
......@@ -2223,9 +2223,9 @@
},
"dependencies": {
"@types/d3": {
"version": "3.5.46",
"resolved": "https://registry.npmjs.org/@types/d3/-/d3-3.5.46.tgz",
"integrity": "sha512-jNHfiGd41+JUV43LTMzQNidyp4Hn0XfhoSmy8baE0d/N5pGYpD+yX03JacY/MH+smFxYOQGXlz4HxkRZOuRNOQ=="
"version": "3.5.47",
"resolved": "https://registry.npmjs.org/@types/d3/-/d3-3.5.47.tgz",
"integrity": "sha512-VkWIQoZXLFdcBGe5pdBKJmTU3fmpXvo/KV6ixvTzOMl1yJ2hbTXpfvsziag0kcaerPDwas2T0vxojwQG3YwivQ=="
}
}
},
......@@ -3778,12 +3778,12 @@
}
},
"color": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/color/-/color-4.0.1.tgz",
"integrity": "sha512-rpZjOKN5O7naJxkH2Rx1sZzzBgaiWECc6BYXjeCE6kF0kcASJYbUq02u7JqIHwCb/j3NhV+QhRL2683aICeGZA==",
"version": "4.2.0",
"resolved": "https://registry.npmjs.org/color/-/color-4.2.0.tgz",
"integrity": "sha512-hHTcrbvEnGjC7WBMk6ibQWFVDgEFTVmjrz2Q5HlU6ltwxv0JJN2Z8I7uRbWeQLF04dikxs8zgyZkazRJvSMtyQ==",
"requires": {
"color-convert": "^2.0.1",
"color-string": "^1.6.0"
"color-string": "^1.9.0"
},
"dependencies": {
"color-convert": {
......@@ -4148,6 +4148,11 @@
}
}
},
"core-js": {
"version": "3.21.1",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.21.1.tgz",
"integrity": "sha512-FRq5b/VMrWlrmCzwRrpDYNxyHP9BcAZC+xHJaqTgIE5091ZV1NTmyh0sGOg5XqpnHvR0svdy0sv1gWA1zmhxig=="
},
"core-js-compat": {
"version": "3.12.1",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.12.1.tgz",
......@@ -4752,11 +4757,11 @@
"integrity": "sha512-Ab3S6XuE/Q+flY96HXT0jOXcM4EAClYFnRGY5zsjRGNy6qCYrQsMffs7cV5Q9xejb35zxW5hf/guKw34kvIKsA=="
},
"d3-geo": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/d3-geo/-/d3-geo-2.0.1.tgz",
"integrity": "sha512-M6yzGbFRfxzNrVhxDJXzJqSLQ90q1cCyb3EWFZ1LF4eWOBYxFypw7I/NFVBNXKNqxv1bqLathhYvdJ6DC+th3A==",
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/d3-geo/-/d3-geo-2.0.2.tgz",
"integrity": "sha512-8pM1WGMLGFuhq9S+FpPURxic+gKzjluCD/CHTuUF3mXMeiCo0i6R0tO1s4+GArRFde96SLcW/kOFRjoAosPsFA==",
"requires": {
"d3-array": ">=2.5"
"d3-array": "^2.5.0"
}
},
"d3-hierarchy": {
......@@ -6019,9 +6024,9 @@
}
},
"focus-trap": {
"version": "6.7.2",
"resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-6.7.2.tgz",
"integrity": "sha512-mRVv9QPCXITaDreu+pNXiPk1Rpn0WQtGvGrDo3Z/s2kdwtzFw/WOPfbLkdxWWvcahoInm9eRztuQOr1RNyQGrw==",
"version": "6.7.3",
"resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-6.7.3.tgz",
"integrity": "sha512-8xCEKndV4KrseGhFKKKmczVA14yx1/hnmFICPOjcFjToxCJYj/NHH43tPc3YE/PLnLRNZoFug0EcWkGQde/miQ==",
"requires": {
"tabbable": "^5.2.1"
}
......@@ -6055,6 +6060,11 @@
"mime-types": "^2.1.12"
}
},
"form-request-submit-polyfill": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/form-request-submit-polyfill/-/form-request-submit-polyfill-2.0.0.tgz",
"integrity": "sha512-p0+M92y2gFnP0AuuL8VJ0GYVzAT0bYp3GsSkmPFhvUopdnfDLP/9xplQTBBc4w8qOjKRzdK7GaFcdL9IhlXdTQ=="
},
"forwarded": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz",
......@@ -8066,9 +8076,9 @@
}
},
"luxon": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/luxon/-/luxon-2.1.1.tgz",
"integrity": "sha512-6VQVNw7+kQu3hL1ZH5GyOhnk8uZm21xS7XJ/6vDZaFNcb62dpFDKcH8TI5NkoZOdMRxr7af7aYGrJlE/Wv0i1w=="
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/luxon/-/luxon-2.3.1.tgz",
"integrity": "sha512-I8vnjOmhXsMSlNMZlMkSOvgrxKJl0uOsEzdGgGNZuZPaS9KlefpE9KV95QFftlJSC+1UyCC9/I69R02cz/zcCA=="
},
"magic-string": {
"version": "0.25.7",
......@@ -8497,9 +8507,9 @@
"dev": true
},
"moment": {
"version": "2.29.1",
"resolved": "https://registry.npmjs.org/moment/-/moment-2.29.1.tgz",
"integrity": "sha512-kHmoybcPV8Sqy59DwNDY3Jefr64lK/by/da0ViFcuA4DH0vQg5Q6Ze5VimxkfQNSC+Mls/Kx53s7TjP1RhFEDQ=="
"version": "2.29.2",
"resolved": "https://registry.npmjs.org/moment/-/moment-2.29.2.tgz",
"integrity": "sha512-UgzG4rvxYpN15jgCmVJwac49h9ly9NurikMWGPdVxm8GZD6XjkKPxDTjQQ43gtGgnV3X0cAyWDdP2Wexoquifg=="
},
"move-concurrently": {
"version": "1.0.1",
......@@ -9958,9 +9968,9 @@
"integrity": "sha512-uEv2pSPk1zQCfaB2VgnUfnUxxlGryYi+5rbdxmZBBt5v9S/pscIQYS5YDLxsQZ7D9jn5c76+Tx5wX/2J1nK6sA=="
},
"primeng": {
"version": "11.4.2",
"resolved": "https://registry.npmjs.org/primeng/-/primeng-11.4.2.tgz",
"integrity": "sha512-ftuh3UBIyK/k/DOlUAbdGkPKmT+Z2OwH3qBhgL7YlXc34JpBXNesOo/jPCL9Zi8nwAoHIL0tvn1GlvGyQ/S2Ew==",
"version": "11.4.5",
"resolved": "https://registry.npmjs.org/primeng/-/primeng-11.4.5.tgz",
"integrity": "sha512-7f5LDHrvFsJA4670Ftmib5ndDxTqcaQiM88XXJrjWYNGjXsXT3Yc5g9fgPvDrg2D38/jjpcSYeW9kalNcvlbrQ==",
"requires": {
"tslib": "^2.0.0"
}
......@@ -9984,9 +9994,9 @@
"dev": true
},
"promise-polyfill": {
"version": "8.2.1",
"resolved": "https://registry.npmjs.org/promise-polyfill/-/promise-polyfill-8.2.1.tgz",
"integrity": "sha512-3p9zj0cEHbp7NVUxEYUWjQlffXqnXaZIMPkAO7HhFh8u5636xLRDHOUo2vpWSK0T2mqm6fKLXYn1KP6PAZ2gKg=="
"version": "8.2.3",
"resolved": "https://registry.npmjs.org/promise-polyfill/-/promise-polyfill-8.2.3.tgz",
"integrity": "sha512-Og0+jCRQetV84U8wVjMNccfGCnMQ9mGs9Hv78QFe+pSDD3gWTpz0y+1QCuxy5d/vBFuZ3iwP2eycAkvqIMPmWg=="
},
"promise-retry": {
"version": "1.1.1",
......@@ -12447,9 +12457,9 @@
"dev": true
},
"tslib": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz",
"integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w=="
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.1.tgz",
"integrity": "sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw=="
},
"tslint": {
"version": "6.1.3",
......@@ -14137,9 +14147,9 @@
"dev": true
},
"xss": {
"version": "1.0.10",
"resolved": "https://registry.npmjs.org/xss/-/xss-1.0.10.tgz",
"integrity": "sha512-qmoqrRksmzqSKvgqzN0055UFWY7OKx1/9JWeRswwEVX9fCG5jcYRxa/A2DHcmZX6VJvjzHRQ2STeeVcQkrmLSw==",
"version": "1.0.11",
"resolved": "https://registry.npmjs.org/xss/-/xss-1.0.11.tgz",
"integrity": "sha512-EimjrjThZeK2MO7WKR9mN5ZC1CSqivSl55wvUK5EtU6acf0rzEE1pN+9ZDrFXJ82BRp3JL38pPE6S4o/rpp1zQ==",
"requires": {
"commander": "^2.20.3",
"cssfilter": "0.0.10"
......@@ -14299,11 +14309,11 @@
"dev": true
},
"zone.js": {
"version": "0.11.4",
"resolved": "https://registry.npmjs.org/zone.js/-/zone.js-0.11.4.tgz",
"integrity": "sha512-DDh2Ab+A/B+9mJyajPjHFPWfYU1H+pdun4wnnk0OcQTNjem1XQSZ2CDW+rfZEUDjv5M19SBqAkjZi0x5wuB5Qw==",
"version": "0.11.5",
"resolved": "https://registry.npmjs.org/zone.js/-/zone.js-0.11.5.tgz",
"integrity": "sha512-D1/7VxEuQ7xk6z/kAROe4SUbd9CzxY4zOwVGnGHerd/SgLIVU5f4esDzQUsOCeArn933BZfWMKydH7l7dPEp0g==",
"requires": {
"tslib": "^2.0.0"
"tslib": "^2.3.0"
}
}
}
......
......@@ -16,6 +16,7 @@ import {DataViewModule} from 'primeng/dataview';
import {RatingModule} from 'primeng/rating';
import {TableModule} from 'primeng/table';
import { PasswordModule } from "primeng/password";
import {OverlayPanelModule} from 'primeng/overlaypanel';
......@@ -28,6 +29,7 @@ import {DialogModule} from 'primeng/dialog';
import {DropdownModule} from 'primeng/dropdown';
import {ProgressBarModule} from 'primeng/progressbar';
import { SplitterModule } from "primeng/splitter";
import { ColorPickerModule } from "primeng/colorpicker";
import {PanelModule} from 'primeng/panel';
......@@ -104,6 +106,13 @@ import { ModelRunMetadataComponent } from './components/model-run-metadata/model
import { VisualizationPanelComponent } from './components/visualization-panel/visualization-panel.component';
import { EsriMapComponent } from './components/esri-map/esri-map.component';
import { DashboardComponent } from './components/dashboard/dashboard.component';
import { LayerEditorComponent } from './components/layer-editor/layer-editor.component';
@NgModule({
......@@ -119,7 +128,9 @@ import { DashboardComponent } from './components/dashboard/dashboard.component';
ModelRunMetadataComponent,
VisualizationPanelComponent,
EsriMapComponent,
DashboardComponent
DashboardComponent,
LayerEditorComponent
],
imports: [
......@@ -135,9 +146,11 @@ import { DashboardComponent } from './components/dashboard/dashboard.component';
BrowserAnimationsModule,
RatingModule,
TableModule,
RippleModule,
CalendarModule,
SliderModule,
DialogModule,
ColorPickerModule,
MultiSelectModule,
ContextMenuModule,
DropdownModule,
......@@ -190,15 +203,16 @@ import { DashboardComponent } from './components/dashboard/dashboard.component';
MatPaginatorModule,
MatSortModule,
MatTableModule,
OverlayPanelModule,
AuthModule.forRoot({
domain: 'YOUR_DOMAIN',
clientId: 'YOUR_CLIENT_ID'
}),
RouterModule.forRoot([
{path: 'proxy/8000', component: HomepageComponent },
{path: 'homepage', component: HomepageComponent },
{path: '', redirectTo:'/proxy/8000', pathMatch: 'full'},
{path: '', redirectTo:'/homepage', pathMatch: 'full'},
{path: '**', component : PageUndefinedPageComponent}
])
......@@ -240,8 +254,9 @@ import { DashboardComponent } from './components/dashboard/dashboard.component';
MatSortModule,
MatTableModule
],
bootstrap: [AppComponent],
providers: [NodeService, PageRoutingParameterService]
})
export class AppModule { }
<div class="container">
<app-esri-map style="width:100%; height:auto; width: 100%; " (wonderMapped)="enablePanel()"></app-esri-map>
</div>
<app-esri-map style="width:100%; height:100%; " (wonderMapped)="enablePanel()"></app-esri-map>
<!-- <div class="container">
<div class="row">
<div class="column-12">
<h5>Select a Location</h5>
<select name="location" id="location" (input)="selectedWonder($event)" [disabled]="selectorDisabled">
<option value="" selected>-----</option>
<option *ngFor="let w of listOfLocations; let i = index;" value={{i}}>{{w.name}}</option>
</select>
<p>{{feedback}}</p>
</div>
<div class="column-12">
<app-esri-map style="width:100%; height:auto; width: 100%; " (wonderMapped)="enablePanel()"></app-esri-map>
</div>
</div>
<div class="row">
<div class="column-12">
<h5>Select a Location</h5>
<select name="location" id="location" (input)="selectedWonder($event)" [disabled]="selectorDisabled">
<option value="" selected>-----</option>
<option *ngFor="let w of listOfLocations; let i = index;" value={{i}}>{{w.name}}</option>
</select>
<p>{{feedback}}</p>
</div>
<div class="column-12">
<app-esri-map style="width:100%; height:auto; width: 100%; " (wonderMapped)="enablePanel()"></app-esri-map>
</div>
</div>
</div> -->
......@@ -23,6 +23,7 @@ export class DashboardComponent implements OnInit {
@ViewChild(EsriMapComponent, { static: true }) map: EsriMapComponent; // needed to reference the child map component
listOfLocations = [
{id: 0, name: 'Nordsea', coordinates: [3.119205,56.237817]},
{id: 1, name: 'Geesthacht', coordinates: [10.1234, 55.5174]},
......@@ -48,6 +49,8 @@ export class DashboardComponent implements OnInit {
}
disablePanel (name) {
this.selectorDisabled = true;
this.feedback = this.feedback = 'Panning to ' + name + '.';
......@@ -59,6 +62,8 @@ export class DashboardComponent implements OnInit {
setTimeout(() => { this.feedback = ''; }, 1000);
};
constructor() { }
ngOnInit() {
......
<!-- Here's the DIV that we inject the map into -->
<div #mapViewNode></div>
<app-layer-editor ></app-layer-editor>
......@@ -4,3 +4,16 @@
.esri-view {
height: 500px;
}
.rendererDivStyle {
width: 40px;
transition: width 1s;
}
.rendererDivStyle:hover {
width: 300px;
}
import { VisualizationPanelComponent } from './../visualization-panel/visualization-panel.component';
import { DataService } from './../../_service/data.service';
import { PrimeNGConfig } from 'primeng/api';
/*
Copyright 2019 Esri
Licensed under the Apache License, Version 2.0 (the "License");
......@@ -15,19 +18,28 @@ import { Component, OnInit, ViewChild, ElementRef, Output, EventEmitter } from '
import { loadModules } from 'esri-loader';
@Component({
selector: 'app-esri-map',
templateUrl: './esri-map.component.html',
styleUrls: ['./esri-map.component.scss']
})
export class EsriMapComponent implements OnInit {
@Output() wonderMapped = new EventEmitter(); // notfies the dashboard component when the map is finished
@ViewChild('mapViewNode', { static: true }) private viewNode: ElementRef; // needed to inject the MapView into the DOM
mapView: __esri.MapView;
constructor() {
color1: string = "#1976D2";
color2: string = "#1976D2";
value1: string;
constructor(private primengConfig: PrimeNGConfig) {
}
panMap = (coordinates) => {
......@@ -40,7 +52,15 @@ export class EsriMapComponent implements OnInit {
});
}
public handleClick() {
}
//************ */
public ngOnInit() {
this.primengConfig.ripple = true;
// use esri-loader to load JSAPI modules
return loadModules([
'esri/Map',
......@@ -53,25 +73,27 @@ export class EsriMapComponent implements OnInit {
'esri/widgets/BasemapLayerList',
'esri/widgets/Fullscreen',
'esri/widgets/Legend',
'esri/Color',
'esri/widgets/LayerList',
'esri/layers/MapImageLayer',
'esri/renderers/Renderer',
'esri/layers/support/RasterFunction',
'esri/widgets/Search',
"esri/renderers/SimpleRenderer"
'esri/renderers/SimpleRenderer',
'esri/smartMapping/renderers/color',
'esri/renderers/RasterColormapRenderer',
'esri/renderers/ClassBreaksRenderer',
'esri/symbols/SimpleFillSymbol',
'esri/Color'
])
.then(([Map, MapView, Graphic, ImageryLayer, Compass, BasemapToggle, CoordinateConversion, BasemapLayerList, Fullscreen, Legend, Color, LayerList, MapImageLayer, Renderer, RasterFunction,Search, SimpleRenderer ]) => {
.then(async ([Map, MapView, Graphic, ImageryLayer, Compass, BasemapToggle, CoordinateConversion, BasemapLayerList, Fullscreen,
Legend, LayerList, MapImageLayer, Renderer, RasterFunction, Search, SimpleRenderer, colorRendererCreator, RasterColormapRenderer, ClassBreaksRenderer, SimpleFillSymbol, Color]) => {
const map: __esri.Map = new Map({
basemap: 'topo-vector'
});
const map2: __esri.Map = new Map({
basemap: 'streets'
});
this.mapView = new MapView({
container: this.viewNode.nativeElement,
......@@ -83,29 +105,125 @@ export class EsriMapComponent implements OnInit {
});
const imagePopupTemplate = {
// autocasts as new PopupTemplate()
title: "Data from {SensorName} satellite",
content: `
Rendered RGB values: <b>{Raster.ServicePixelValue} </b>
<br>Original values (B, G, R, NIR): <b>{Raster.ItemPixelValue} </b>
<br>Original values (B, G, R, NIR): <b>{Raster.ItemPixelValue} </b>
<br>Legend: <b>{Raster.Colormap.value} </b>
`
};
const serviceRFT = new RasterFunction({
functionName: "HZG_coastmap_TOC_Classified",