|
@@ -11,167 +11,164 @@ import 'datasource-selector.module';
|
|
|
import 'sidebar.module';
|
|
import 'sidebar.module';
|
|
|
import 'draw.module';
|
|
import 'draw.module';
|
|
|
import View from 'ol/View';
|
|
import View from 'ol/View';
|
|
|
-import { transform, transformExtent } from 'ol/proj';
|
|
|
|
|
-import { Tile, Group, Image as ImageLayer } from 'ol/layer';
|
|
|
|
|
-import { TileWMS, WMTS, OSM, XYZ, TileArcGISRest } from 'ol/source';
|
|
|
|
|
-import { Style, Icon, Stroke, Fill, Circle, Text } from 'ol/style';
|
|
|
|
|
|
|
+import { Tile } from 'ol/layer';
|
|
|
|
|
+import { OSM } from 'ol/source';
|
|
|
|
|
+import { Style, Stroke, Fill } from 'ol/style';
|
|
|
import VectorLayer from 'ol/layer/Vector';
|
|
import VectorLayer from 'ol/layer/Vector';
|
|
|
import './adjuster/adjuster.module';
|
|
import './adjuster/adjuster.module';
|
|
|
import nuts from 'nuts';
|
|
import nuts from 'nuts';
|
|
|
|
|
|
|
|
-var module = angular.module('hs', [
|
|
|
|
|
- 'hs.sidebar',
|
|
|
|
|
- 'hs.draw',
|
|
|
|
|
- 'hs.info',
|
|
|
|
|
- 'hs.toolbar',
|
|
|
|
|
- 'hs.layermanager',
|
|
|
|
|
- 'hs.query',
|
|
|
|
|
- 'hs.search', 'hs.print', 'hs.permalink',
|
|
|
|
|
- 'hs.geolocation',
|
|
|
|
|
- 'hs.datasource_selector',
|
|
|
|
|
- 'hs.save-map',
|
|
|
|
|
- 'hs.measure',
|
|
|
|
|
- 'hs.addLayers',
|
|
|
|
|
- 'pra.adjuster'
|
|
|
|
|
|
|
+const module = angular.module('hs', [
|
|
|
|
|
+ 'hs.sidebar',
|
|
|
|
|
+ 'hs.draw',
|
|
|
|
|
+ 'hs.info',
|
|
|
|
|
+ 'hs.toolbar',
|
|
|
|
|
+ 'hs.layermanager',
|
|
|
|
|
+ 'hs.query',
|
|
|
|
|
+ 'hs.search', 'hs.print', 'hs.permalink',
|
|
|
|
|
+ 'hs.geolocation',
|
|
|
|
|
+ 'hs.datasource_selector',
|
|
|
|
|
+ 'hs.save-map',
|
|
|
|
|
+ 'hs.measure',
|
|
|
|
|
+ 'hs.addLayers',
|
|
|
|
|
+ 'pra.adjuster'
|
|
|
]);
|
|
]);
|
|
|
|
|
|
|
|
module.directive('hs', ['config', 'Core', function (config, Core) {
|
|
module.directive('hs', ['config', 'Core', function (config, Core) {
|
|
|
- return {
|
|
|
|
|
- template: Core.hslayersNgTemplate,
|
|
|
|
|
- link: function (scope, element) {
|
|
|
|
|
- Core.fullScreenMap(element);
|
|
|
|
|
- }
|
|
|
|
|
- };
|
|
|
|
|
|
|
+ return {
|
|
|
|
|
+ template: Core.hslayersNgTemplate,
|
|
|
|
|
+ link: function (scope, element) {
|
|
|
|
|
+ Core.fullScreenMap(element);
|
|
|
|
|
+ }
|
|
|
|
|
+ };
|
|
|
}]);
|
|
}]);
|
|
|
|
|
|
|
|
-function getHostname() {
|
|
|
|
|
- var url = window.location.href
|
|
|
|
|
- var urlArr = url.split("/");
|
|
|
|
|
- var domain = urlArr[2];
|
|
|
|
|
- return urlArr[0] + "//" + domain;
|
|
|
|
|
|
|
+function getHostname () {
|
|
|
|
|
+ const url = window.location.href;
|
|
|
|
|
+ const urlArr = url.split('/');
|
|
|
|
|
+ const domain = urlArr[2];
|
|
|
|
|
+ return urlArr[0] + '//' + domain;
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
-
|
|
|
|
|
-var stroke = new Stroke({
|
|
|
|
|
- color: '#3399CC',
|
|
|
|
|
- width: 0.25
|
|
|
|
|
|
|
+const stroke = new Stroke({
|
|
|
|
|
+ color: '#3399CC',
|
|
|
|
|
+ width: 0.25
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
-function perc2color(perc) {
|
|
|
|
|
- perc = perc * 100;
|
|
|
|
|
- var r, g, b = 0;
|
|
|
|
|
- if(perc < 50) {
|
|
|
|
|
- r = 255;
|
|
|
|
|
- g = Math.round(5.1 * perc);
|
|
|
|
|
- }
|
|
|
|
|
- else {
|
|
|
|
|
- g = 255;
|
|
|
|
|
- r = Math.round(510 - 5.10 * perc);
|
|
|
|
|
- }
|
|
|
|
|
- var h = r * 0x10000 + g * 0x100 + b * 0x1;
|
|
|
|
|
- return `rgba(${r}, ${g}, ${b}, 0.7)`;
|
|
|
|
|
|
|
+function perc2color (perc) {
|
|
|
|
|
+ perc = perc * 100;
|
|
|
|
|
+ let r; let g; const b = 0;
|
|
|
|
|
+ if (perc < 50) {
|
|
|
|
|
+ r = 255;
|
|
|
|
|
+ g = Math.round(5.1 * perc);
|
|
|
|
|
+ } else {
|
|
|
|
|
+ g = 255;
|
|
|
|
|
+ r = Math.round(510 - 5.10 * perc);
|
|
|
|
|
+ }
|
|
|
|
|
+ // eslint-disable-next-line no-unused-vars
|
|
|
|
|
+ const h = r * 0x10000 + g * 0x100 + b * 0x1;
|
|
|
|
|
+ return `rgba(${r}, ${g}, ${b}, 0.7)`;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-var styles = function(feature){
|
|
|
|
|
- if(isNaN(feature.get('total'))){
|
|
|
|
|
- return [new Style({
|
|
|
|
|
- fill: new Fill({
|
|
|
|
|
- color: '#FFF'
|
|
|
|
|
- }),
|
|
|
|
|
- stroke: stroke
|
|
|
|
|
- })]
|
|
|
|
|
- } else
|
|
|
|
|
|
|
+const styles = function (feature) {
|
|
|
|
|
+ if (isNaN(feature.get('total'))) {
|
|
|
return [new Style({
|
|
return [new Style({
|
|
|
- fill: new Fill({
|
|
|
|
|
- color: perc2color(feature.get('total'))
|
|
|
|
|
- }),
|
|
|
|
|
- stroke: stroke
|
|
|
|
|
- })]
|
|
|
|
|
|
|
+ fill: new Fill({
|
|
|
|
|
+ color: '#FFF'
|
|
|
|
|
+ }),
|
|
|
|
|
+ stroke: stroke
|
|
|
|
|
+ })];
|
|
|
|
|
+ } else {
|
|
|
|
|
+ return [new Style({
|
|
|
|
|
+ fill: new Fill({
|
|
|
|
|
+ color: perc2color(feature.get('total'))
|
|
|
|
|
+ }),
|
|
|
|
|
+ stroke: stroke
|
|
|
|
|
+ })];
|
|
|
|
|
+ }
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
-var nuts2Layer = new VectorLayer({
|
|
|
|
|
- source: nuts.nuts2Source,
|
|
|
|
|
- visible: false,
|
|
|
|
|
- style: styles,
|
|
|
|
|
- title: 'NUTS2 regions'
|
|
|
|
|
|
|
+const nuts2Layer = new VectorLayer({
|
|
|
|
|
+ source: nuts.nuts2Source,
|
|
|
|
|
+ visible: false,
|
|
|
|
|
+ style: styles,
|
|
|
|
|
+ title: 'NUTS2 regions'
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
-
|
|
|
|
|
-var nuts3Layer = new VectorLayer({
|
|
|
|
|
- source: nuts.nuts3Source,
|
|
|
|
|
- visible: true,
|
|
|
|
|
- style: styles,
|
|
|
|
|
- title: 'NUTS3 regions',
|
|
|
|
|
|
|
+const nuts3Layer = new VectorLayer({
|
|
|
|
|
+ source: nuts.nuts3Source,
|
|
|
|
|
+ visible: true,
|
|
|
|
|
+ style: styles,
|
|
|
|
|
+ title: 'NUTS3 regions'
|
|
|
});
|
|
});
|
|
|
-nuts3Layer.set('hoveredKeys', ['NUTS_NAME', 'totalForHumans', "Social & Human", "Anthropic", "Institutional", "Economical", "Natural", "Cultural"]);
|
|
|
|
|
-nuts3Layer.set('hoveredKeysTranslations', {'NUTS_NAME': 'Name', 'totalForHumans': 'Calculated score'});
|
|
|
|
|
-
|
|
|
|
|
|
|
+nuts3Layer.set('hoveredKeys', ['NUTS_NAME', 'totalForHumans', 'Social & Human', 'Anthropic', 'Institutional', 'Economical', 'Natural', 'Cultural']);
|
|
|
|
|
+nuts3Layer.set('hoveredKeysTranslations', { NUTS_NAME: 'Name', totalForHumans: 'Calculated score' });
|
|
|
|
|
|
|
|
module.value('config', {
|
|
module.value('config', {
|
|
|
- proxyPrefix: "../8085/",
|
|
|
|
|
- default_layers: [
|
|
|
|
|
- new Tile({
|
|
|
|
|
- source: new OSM(),
|
|
|
|
|
- title: "Open street map",
|
|
|
|
|
- base: true,
|
|
|
|
|
- editor: { editable: false },
|
|
|
|
|
- removable: false
|
|
|
|
|
- }),
|
|
|
|
|
- nuts2Layer,
|
|
|
|
|
- nuts3Layer
|
|
|
|
|
- ],
|
|
|
|
|
- project_name: 'erra/map',
|
|
|
|
|
- default_view: new View({
|
|
|
|
|
- center: [2433348.3022471312, 7744501.813885343],
|
|
|
|
|
- zoom: 3.6,
|
|
|
|
|
- units: "m"
|
|
|
|
|
|
|
+ proxyPrefix: '../8085/',
|
|
|
|
|
+ default_layers: [
|
|
|
|
|
+ new Tile({
|
|
|
|
|
+ source: new OSM(),
|
|
|
|
|
+ title: 'Open street map',
|
|
|
|
|
+ base: true,
|
|
|
|
|
+ editor: { editable: false },
|
|
|
|
|
+ removable: false
|
|
|
}),
|
|
}),
|
|
|
- advanced_form: true,
|
|
|
|
|
- datasources: [],
|
|
|
|
|
- hostname: {
|
|
|
|
|
- "default": {
|
|
|
|
|
- "title": "Default",
|
|
|
|
|
- "type": "default",
|
|
|
|
|
- "editable": false,
|
|
|
|
|
- "url": getHostname()
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- panelWidths: {
|
|
|
|
|
- },
|
|
|
|
|
- panelsEnabled: {
|
|
|
|
|
- language: false,
|
|
|
|
|
- composition_browser: false,
|
|
|
|
|
- legend: false,
|
|
|
|
|
- ows: false,
|
|
|
|
|
- info: false,
|
|
|
|
|
- saveMap: false,
|
|
|
|
|
- draw: false
|
|
|
|
|
- },
|
|
|
|
|
- searchProvider: (q) => {
|
|
|
|
|
- return `/app/jupyter-test/8085/search/?q=${q}`
|
|
|
|
|
|
|
+ nuts2Layer,
|
|
|
|
|
+ nuts3Layer
|
|
|
|
|
+ ],
|
|
|
|
|
+ project_name: 'erra/map',
|
|
|
|
|
+ default_view: new View({
|
|
|
|
|
+ center: [2433348.3022471312, 7744501.813885343],
|
|
|
|
|
+ zoom: 3.6,
|
|
|
|
|
+ units: 'm'
|
|
|
|
|
+ }),
|
|
|
|
|
+ advanced_form: true,
|
|
|
|
|
+ datasources: [],
|
|
|
|
|
+ hostname: {
|
|
|
|
|
+ default: {
|
|
|
|
|
+ title: 'Default',
|
|
|
|
|
+ type: 'default',
|
|
|
|
|
+ editable: false,
|
|
|
|
|
+ url: getHostname()
|
|
|
}
|
|
}
|
|
|
|
|
+ },
|
|
|
|
|
+ panelWidths: {
|
|
|
|
|
+ },
|
|
|
|
|
+ panelsEnabled: {
|
|
|
|
|
+ language: false,
|
|
|
|
|
+ composition_browser: false,
|
|
|
|
|
+ legend: false,
|
|
|
|
|
+ ows: false,
|
|
|
|
|
+ info: false,
|
|
|
|
|
+ saveMap: false,
|
|
|
|
|
+ draw: false
|
|
|
|
|
+ },
|
|
|
|
|
+ searchProvider: (q) => {
|
|
|
|
|
+ return `/app/jupyter-test/8085/search/?q=${q}`;
|
|
|
|
|
+ }
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
module.controller('Main', ['$scope', 'Core', '$compile', 'hs.layout.service', 'pra.adjuster.service',
|
|
module.controller('Main', ['$scope', 'Core', '$compile', 'hs.layout.service', 'pra.adjuster.service',
|
|
|
- function ($scope, Core, $compile, layoutService, adjusterService) {
|
|
|
|
|
- $scope.Core = Core;
|
|
|
|
|
- $scope.panelVisible = layoutService.panelVisible;
|
|
|
|
|
- layoutService.sidebarRight = false;
|
|
|
|
|
- //layoutService.sidebarToggleable = false;
|
|
|
|
|
- Core.singleDatasources = true;
|
|
|
|
|
- layoutService.sidebarButtons = true;
|
|
|
|
|
- layoutService.setDefaultPanel('adjuster');
|
|
|
|
|
- $scope.$on("scope_loaded", function (event, args) {
|
|
|
|
|
- if (args == 'Sidebar') {
|
|
|
|
|
- var el = angular.element('<pra.adjuster hs.draggable ng-if="Core.exists(\'pra.adjuster\')" ng-show="panelVisible(\'adjuster\', this)"></pra.adjuster>')[0];
|
|
|
|
|
- layoutService.panelListElement.appendChild(el);
|
|
|
|
|
- $compile(el)($scope);
|
|
|
|
|
|
|
+ function ($scope, Core, $compile, layoutService, adjusterService) {
|
|
|
|
|
+ $scope.Core = Core;
|
|
|
|
|
+ $scope.panelVisible = layoutService.panelVisible;
|
|
|
|
|
+ layoutService.sidebarRight = false;
|
|
|
|
|
+ // layoutService.sidebarToggleable = false;
|
|
|
|
|
+ Core.singleDatasources = true;
|
|
|
|
|
+ layoutService.sidebarButtons = true;
|
|
|
|
|
+ layoutService.setDefaultPanel('adjuster');
|
|
|
|
|
+ $scope.$on('scope_loaded', function (event, args) {
|
|
|
|
|
+ // eslint-disable-next-line eqeqeq
|
|
|
|
|
+ if (args == 'Sidebar') {
|
|
|
|
|
+ const el = angular.element('<pra.adjuster hs.draggable ng-if="Core.exists(\'pra.adjuster\')" ng-show="panelVisible(\'adjuster\', this)"></pra.adjuster>')[0];
|
|
|
|
|
+ layoutService.panelListElement.appendChild(el);
|
|
|
|
|
+ $compile(el)($scope);
|
|
|
|
|
|
|
|
- var toolbar_button = angular.element('<div pra.adjuster.sidebar-btn></div>')[0];
|
|
|
|
|
- layoutService.sidebarListElement.appendChild(toolbar_button);
|
|
|
|
|
- $compile(toolbar_button)(event.targetScope);
|
|
|
|
|
- }
|
|
|
|
|
- })
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ const toolbarButton = angular.element('<div pra.adjuster.sidebar-btn></div>')[0];
|
|
|
|
|
+ layoutService.sidebarListElement.appendChild(toolbarButton);
|
|
|
|
|
+ $compile(toolbarButton)(event.targetScope);
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ }
|
|
|
]);
|
|
]);
|
|
|
-
|
|
|