|
@@ -1,10 +1,8 @@
|
|
|
-import VectorLayer from 'ol/layer/Vector';
|
|
|
|
|
-import View from 'ol/View';
|
|
|
|
|
import {Fill, Stroke, Style} from 'ol/style';
|
|
import {Fill, Stroke, Style} from 'ol/style';
|
|
|
-import {OSM} from 'ol/source';
|
|
|
|
|
-import {Tile} from 'ol/layer';
|
|
|
|
|
-
|
|
|
|
|
-import nuts from './nuts';
|
|
|
|
|
|
|
+import {GeoJSON} from 'ol/format';
|
|
|
|
|
+import {OSM, Vector as VectorSource} from 'ol/source';
|
|
|
|
|
+import {Tile, Vector as VectorLayer} from 'ol/layer';
|
|
|
|
|
+import {View} from 'ol';
|
|
|
|
|
|
|
|
function getHostname() {
|
|
function getHostname() {
|
|
|
const url = window.location.href;
|
|
const url = window.location.href;
|
|
@@ -30,7 +28,7 @@ function perc2color(perc) {
|
|
|
g = 255;
|
|
g = 255;
|
|
|
r = Math.round(510 - 5.1 * perc);
|
|
r = Math.round(510 - 5.1 * perc);
|
|
|
}
|
|
}
|
|
|
- // eslint-disable-next-line no-unused-vars
|
|
|
|
|
|
|
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
|
const h = r * 0x10000 + g * 0x100 + b * 0x1;
|
|
const h = r * 0x10000 + g * 0x100 + b * 0x1;
|
|
|
return `rgba(${r}, ${g}, ${b}, 0.7)`;
|
|
return `rgba(${r}, ${g}, ${b}, 0.7)`;
|
|
|
}
|
|
}
|
|
@@ -57,20 +55,16 @@ const styles = function (feature) {
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
-const nuts2Layer = new VectorLayer({
|
|
|
|
|
- source: nuts.nuts2Source,
|
|
|
|
|
- visible: false,
|
|
|
|
|
- style: styles,
|
|
|
|
|
- title: 'NUTS2 regions',
|
|
|
|
|
-});
|
|
|
|
|
-
|
|
|
|
|
-const nuts3Layer = new VectorLayer({
|
|
|
|
|
- source: nuts.nuts3Source,
|
|
|
|
|
|
|
+const obceLayer = new VectorLayer({
|
|
|
|
|
+ source: new VectorSource({
|
|
|
|
|
+ format: new GeoJSON(),
|
|
|
|
|
+ url: require('./data/obce_cr_20210310_simplified_5514.geojson').default,
|
|
|
|
|
+ }),
|
|
|
visible: true,
|
|
visible: true,
|
|
|
style: styles,
|
|
style: styles,
|
|
|
- title: 'NUTS3 regions',
|
|
|
|
|
|
|
+ title: 'Obce ČR',
|
|
|
});
|
|
});
|
|
|
-nuts3Layer.set('hoveredKeys', [
|
|
|
|
|
|
|
+obceLayer.set('hoveredKeys', [
|
|
|
'NUTS_NAME',
|
|
'NUTS_NAME',
|
|
|
'totalForHumans',
|
|
'totalForHumans',
|
|
|
'Social & Human',
|
|
'Social & Human',
|
|
@@ -80,7 +74,7 @@ nuts3Layer.set('hoveredKeys', [
|
|
|
'Natural',
|
|
'Natural',
|
|
|
'Cultural',
|
|
'Cultural',
|
|
|
]);
|
|
]);
|
|
|
-nuts3Layer.set('hoveredKeysTranslations', {
|
|
|
|
|
|
|
+obceLayer.set('hoveredKeysTranslations', {
|
|
|
NUTS_NAME: 'Name',
|
|
NUTS_NAME: 'Name',
|
|
|
totalForHumans: 'Calculated score',
|
|
totalForHumans: 'Calculated score',
|
|
|
});
|
|
});
|
|
@@ -90,13 +84,12 @@ export const AppConfig = {
|
|
|
default_layers: [
|
|
default_layers: [
|
|
|
new Tile({
|
|
new Tile({
|
|
|
source: new OSM(),
|
|
source: new OSM(),
|
|
|
- title: 'Open street map',
|
|
|
|
|
|
|
+ title: 'OpenStreetMap',
|
|
|
base: true,
|
|
base: true,
|
|
|
editor: {editable: false},
|
|
editor: {editable: false},
|
|
|
removable: false,
|
|
removable: false,
|
|
|
}),
|
|
}),
|
|
|
- nuts2Layer,
|
|
|
|
|
- nuts3Layer,
|
|
|
|
|
|
|
+ obceLayer,
|
|
|
],
|
|
],
|
|
|
project_name: 'erra/map',
|
|
project_name: 'erra/map',
|
|
|
default_view: new View({
|
|
default_view: new View({
|