|
@@ -1,69 +1,49 @@
|
|
|
'use strict';
|
|
'use strict';
|
|
|
-import 'toolbar.module';
|
|
|
|
|
-import 'print.module';
|
|
|
|
|
-import 'query.module';
|
|
|
|
|
-import 'search.module';
|
|
|
|
|
-import 'add-layers.module';
|
|
|
|
|
-import 'measure.module';
|
|
|
|
|
-import 'permalink.module';
|
|
|
|
|
-import 'info.module';
|
|
|
|
|
-import 'datasource-selector.module';
|
|
|
|
|
-import 'sidebar.module';
|
|
|
|
|
-import 'draw.module';
|
|
|
|
|
-import View from 'ol/View';
|
|
|
|
|
-import { Tile } from 'ol/layer';
|
|
|
|
|
-import { OSM } from 'ol/source';
|
|
|
|
|
-import { Style, Stroke, Fill } from 'ol/style';
|
|
|
|
|
|
|
+//import angular from 'angular';
|
|
|
|
|
+import 'hslayers-ng/components/add-layers/add-layers.module';
|
|
|
|
|
+import 'hslayers-ng/components/datasource-selector/datasource-selector.module';
|
|
|
|
|
+import 'hslayers-ng/components/draw/draw.module';
|
|
|
|
|
+import 'hslayers-ng/components/info/info.module';
|
|
|
|
|
+import 'hslayers-ng/components/measure/measure.module';
|
|
|
|
|
+import 'hslayers-ng/components/permalink/permalink.module';
|
|
|
|
|
+import 'hslayers-ng/components/print/print.module';
|
|
|
|
|
+import 'hslayers-ng/components/query/query.module';
|
|
|
|
|
+import 'hslayers-ng/components/search/search.module';
|
|
|
|
|
+import 'hslayers-ng/components/sidebar/sidebar.module';
|
|
|
|
|
+import 'hslayers-ng/components/toolbar/toolbar.module';
|
|
|
|
|
+// hslayers-ng components must be loaded first, otherwise angular will be undefined
|
|
|
|
|
+// eslint-disable-next-line sort-imports-es6-autofix/sort-imports-es6
|
|
|
|
|
+import './adjuster/adjuster.module.js';
|
|
|
import VectorLayer from 'ol/layer/Vector';
|
|
import VectorLayer from 'ol/layer/Vector';
|
|
|
-import './adjuster/adjuster.module';
|
|
|
|
|
-import nuts from './nuts';
|
|
|
|
|
-
|
|
|
|
|
-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', ['HsConfig', 'HsCore', function (config, Core) {
|
|
|
|
|
- return {
|
|
|
|
|
- template: Core.hslayersNgTemplate,
|
|
|
|
|
- /* link: function (scope, element) {
|
|
|
|
|
- Core.fullScreenMap(element);
|
|
|
|
|
- } */
|
|
|
|
|
- };
|
|
|
|
|
-}]);
|
|
|
|
|
|
|
+import View from 'ol/View';
|
|
|
|
|
+import nuts from './nuts.js';
|
|
|
|
|
+import {Fill, Stroke, Style} from 'ol/style';
|
|
|
|
|
+import {OSM} from 'ol/source';
|
|
|
|
|
+import {Tile} from 'ol/layer';
|
|
|
|
|
|
|
|
-function getHostname () {
|
|
|
|
|
|
|
+function getHostname() {
|
|
|
const url = window.location.href;
|
|
const url = window.location.href;
|
|
|
const urlArr = url.split('/');
|
|
const urlArr = url.split('/');
|
|
|
const domain = urlArr[2];
|
|
const domain = urlArr[2];
|
|
|
return urlArr[0] + '//' + domain;
|
|
return urlArr[0] + '//' + domain;
|
|
|
-};
|
|
|
|
|
|
|
+}
|
|
|
|
|
|
|
|
const stroke = new Stroke({
|
|
const stroke = new Stroke({
|
|
|
color: '#3399CC',
|
|
color: '#3399CC',
|
|
|
- width: 0.25
|
|
|
|
|
|
|
+ width: 0.25,
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
-function perc2color (perc) {
|
|
|
|
|
|
|
+function perc2color(perc) {
|
|
|
perc = perc * 100;
|
|
perc = perc * 100;
|
|
|
- let r; let g; const b = 0;
|
|
|
|
|
|
|
+ let r;
|
|
|
|
|
+ let g;
|
|
|
|
|
+ const b = 0;
|
|
|
if (perc < 50) {
|
|
if (perc < 50) {
|
|
|
r = 255;
|
|
r = 255;
|
|
|
g = Math.round(5.1 * perc);
|
|
g = Math.round(5.1 * perc);
|
|
|
} else {
|
|
} else {
|
|
|
g = 255;
|
|
g = 255;
|
|
|
- r = Math.round(510 - 5.10 * perc);
|
|
|
|
|
|
|
+ r = Math.round(510 - 5.1 * perc);
|
|
|
}
|
|
}
|
|
|
// eslint-disable-next-line no-unused-vars
|
|
// eslint-disable-next-line no-unused-vars
|
|
|
// const h = r * 0x10000 + g * 0x100 + b * 0x1;
|
|
// const h = r * 0x10000 + g * 0x100 + b * 0x1;
|
|
@@ -72,19 +52,23 @@ function perc2color (perc) {
|
|
|
|
|
|
|
|
const styles = function (feature) {
|
|
const styles = function (feature) {
|
|
|
if (isNaN(feature.get('total'))) {
|
|
if (isNaN(feature.get('total'))) {
|
|
|
- return [new Style({
|
|
|
|
|
- fill: new Fill({
|
|
|
|
|
- color: '#FFF'
|
|
|
|
|
|
|
+ return [
|
|
|
|
|
+ new Style({
|
|
|
|
|
+ fill: new Fill({
|
|
|
|
|
+ color: '#FFF',
|
|
|
|
|
+ }),
|
|
|
|
|
+ stroke: stroke,
|
|
|
}),
|
|
}),
|
|
|
- stroke: stroke
|
|
|
|
|
- })];
|
|
|
|
|
|
|
+ ];
|
|
|
} else {
|
|
} else {
|
|
|
- return [new Style({
|
|
|
|
|
- fill: new Fill({
|
|
|
|
|
- color: perc2color(feature.get('total'))
|
|
|
|
|
|
|
+ return [
|
|
|
|
|
+ new Style({
|
|
|
|
|
+ fill: new Fill({
|
|
|
|
|
+ color: perc2color(feature.get('total')),
|
|
|
|
|
+ }),
|
|
|
|
|
+ stroke: stroke,
|
|
|
}),
|
|
}),
|
|
|
- stroke: stroke
|
|
|
|
|
- })];
|
|
|
|
|
|
|
+ ];
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
|
|
|
|
@@ -92,84 +76,133 @@ const nuts2Layer = new VectorLayer({
|
|
|
source: nuts.nuts2Source,
|
|
source: nuts.nuts2Source,
|
|
|
visible: false,
|
|
visible: false,
|
|
|
style: styles,
|
|
style: styles,
|
|
|
- title: 'NUTS2 regions'
|
|
|
|
|
|
|
+ title: 'NUTS2 regions',
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
const nuts3Layer = new VectorLayer({
|
|
const nuts3Layer = new VectorLayer({
|
|
|
source: nuts.nuts3Source,
|
|
source: nuts.nuts3Source,
|
|
|
visible: true,
|
|
visible: true,
|
|
|
style: styles,
|
|
style: styles,
|
|
|
- title: 'NUTS3 regions'
|
|
|
|
|
|
|
+ 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' });
|
|
|
|
|
-
|
|
|
|
|
-module.value('HsConfig', {
|
|
|
|
|
- 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'
|
|
|
|
|
- }),
|
|
|
|
|
- advanced_form: true,
|
|
|
|
|
- datasources: [],
|
|
|
|
|
- hostname: {
|
|
|
|
|
- default: {
|
|
|
|
|
- title: 'Default',
|
|
|
|
|
- type: 'default',
|
|
|
|
|
- editable: false,
|
|
|
|
|
- url: getHostname()
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- panelWidths: {
|
|
|
|
|
- },
|
|
|
|
|
- // allowAddExternalDatasets: false,
|
|
|
|
|
- panelsEnabled: {
|
|
|
|
|
- composition_browser: false,
|
|
|
|
|
- legend: false,
|
|
|
|
|
- draw: false,
|
|
|
|
|
- info: false,
|
|
|
|
|
- saveMap: false,
|
|
|
|
|
- language: false
|
|
|
|
|
- },
|
|
|
|
|
- searchProvider: (q) => {
|
|
|
|
|
- return `/app/jupyter-test/8085/search/?q=${q}`;
|
|
|
|
|
- },
|
|
|
|
|
- sizeMode: 'fullscreen'
|
|
|
|
|
|
|
+nuts3Layer.set('hoveredKeys', [
|
|
|
|
|
+ 'NUTS_NAME',
|
|
|
|
|
+ 'totalForHumans',
|
|
|
|
|
+ 'Social & Human',
|
|
|
|
|
+ 'Anthropic',
|
|
|
|
|
+ 'Institutional',
|
|
|
|
|
+ 'Economical',
|
|
|
|
|
+ 'Natural',
|
|
|
|
|
+ 'Cultural',
|
|
|
|
|
+]);
|
|
|
|
|
+nuts3Layer.set('hoveredKeysTranslations', {
|
|
|
|
|
+ NUTS_NAME: 'Name',
|
|
|
|
|
+ totalForHumans: 'Calculated score',
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
-module.controller('Main', ['$scope', 'HsCore', '$compile', 'HsLayoutService', '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) {
|
|
|
|
|
- // 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);
|
|
|
|
|
|
|
+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',
|
|
|
|
|
+ ])
|
|
|
|
|
+ .directive('hs', [
|
|
|
|
|
+ 'HsConfig',
|
|
|
|
|
+ 'HsCore',
|
|
|
|
|
+ function (config, Core) {
|
|
|
|
|
+ return {
|
|
|
|
|
+ template: Core.hslayersNgTemplate,
|
|
|
|
|
+ /* link: function (scope, element) {
|
|
|
|
|
+ Core.fullScreenMap(element);
|
|
|
|
|
+ } */
|
|
|
|
|
+ };
|
|
|
|
|
+ },
|
|
|
|
|
+ ])
|
|
|
|
|
+ .value('HsConfig', {
|
|
|
|
|
+ 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',
|
|
|
|
|
+ }),
|
|
|
|
|
+ advanced_form: true,
|
|
|
|
|
+ datasources: [],
|
|
|
|
|
+ hostname: {
|
|
|
|
|
+ default: {
|
|
|
|
|
+ title: 'Default',
|
|
|
|
|
+ type: 'default',
|
|
|
|
|
+ editable: false,
|
|
|
|
|
+ url: getHostname(),
|
|
|
|
|
+ },
|
|
|
|
|
+ },
|
|
|
|
|
+ panelWidths: {},
|
|
|
|
|
+ // allowAddExternalDatasets: false,
|
|
|
|
|
+ panelsEnabled: {
|
|
|
|
|
+ composition_browser: false,
|
|
|
|
|
+ legend: false,
|
|
|
|
|
+ draw: false,
|
|
|
|
|
+ info: false,
|
|
|
|
|
+ saveMap: false,
|
|
|
|
|
+ language: false,
|
|
|
|
|
+ },
|
|
|
|
|
+ searchProvider: (q) => {
|
|
|
|
|
+ return `/app/jupyter-test/8085/search/?q=${q}`;
|
|
|
|
|
+ },
|
|
|
|
|
+ sizeMode: 'fullscreen',
|
|
|
|
|
+ })
|
|
|
|
|
+ .controller('MainController', [
|
|
|
|
|
+ '$scope',
|
|
|
|
|
+ 'HsCore',
|
|
|
|
|
+ '$compile',
|
|
|
|
|
+ 'HsLayoutService',
|
|
|
|
|
+ '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) {
|
|
|
|
|
+ // 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);
|
|
|
|
|
|
|
|
- const toolbarButton = angular.element('<div pra.adjuster.sidebar-btn></div>')[0];
|
|
|
|
|
- layoutService.sidebarListElement.appendChild(toolbarButton);
|
|
|
|
|
- $compile(toolbarButton)(event.targetScope);
|
|
|
|
|
- }
|
|
|
|
|
- });
|
|
|
|
|
- }
|
|
|
|
|
-]);
|
|
|
|
|
|
|
+ const toolbarButton = angular.element(
|
|
|
|
|
+ '<div pra.adjuster.sidebar-btn></div>'
|
|
|
|
|
+ )[0];
|
|
|
|
|
+ layoutService.sidebarListElement.appendChild(toolbarButton);
|
|
|
|
|
+ $compile(toolbarButton)(event.targetScope);
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ ]);
|