diff --git a/app/package-lock.json b/app/package-lock.json index d58615fb46..9d00743961 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -25,6 +25,7 @@ "chartjs-chart-geo": "^2.1.0", "chartjs-plugin-annotation": "^0.5.7", "chartjs-plugin-datalabels": "^0.7.0", + "chartjs-plugin-regression": "^0.2.1", "chartjs-plugin-zoom": "^0.7.7", "colormap": "^2.3.2", "core-js": "^3.6.4", @@ -6248,6 +6249,17 @@ "chart.js": ">= 2.7.0 < 3" } }, + "node_modules/chartjs-plugin-regression": { + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/chartjs-plugin-regression/-/chartjs-plugin-regression-0.2.1.tgz", + "integrity": "sha512-87LCN1J9KeQlPRpdSUU3YOcOHUtfTTCOJXUuBAXuc8VVlKQjZdq7M9j60d4/juaHWxcGE7uGeUAnye2/FdtjJw==", + "dependencies": { + "regression": "^2.0.1" + }, + "peerDependencies": { + "chart.js": "^2.6.0" + } + }, "node_modules/chartjs-plugin-zoom": { "version": "0.7.7", "resolved": "https://registry.npmjs.org/chartjs-plugin-zoom/-/chartjs-plugin-zoom-0.7.7.tgz", @@ -17185,6 +17197,11 @@ "regl": "~2.1.0" } }, + "node_modules/regression": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/regression/-/regression-2.0.1.tgz", + "integrity": "sha512-A4XYsc37dsBaNOgEjkJKzfJlE394IMmUPlI/p3TTI9u3T+2a+eox5Pr/CPUqF0eszeWZJPAc6QkroAhuUpWDJQ==" + }, "node_modules/relateurl": { "version": "0.2.7", "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz", @@ -27218,6 +27235,14 @@ "integrity": "sha512-PKVUX14nYhH0wcdCpgOoC39Gbzvn6cZ7O9n+bwc02yKD9FTnJ7/TSrBcfebmolFZp1Rcicr9xbT0a5HUbigS7g==", "requires": {} }, + "chartjs-plugin-regression": { + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/chartjs-plugin-regression/-/chartjs-plugin-regression-0.2.1.tgz", + "integrity": "sha512-87LCN1J9KeQlPRpdSUU3YOcOHUtfTTCOJXUuBAXuc8VVlKQjZdq7M9j60d4/juaHWxcGE7uGeUAnye2/FdtjJw==", + "requires": { + "regression": "^2.0.1" + } + }, "chartjs-plugin-zoom": { "version": "0.7.7", "resolved": "https://registry.npmjs.org/chartjs-plugin-zoom/-/chartjs-plugin-zoom-0.7.7.tgz", @@ -35807,6 +35832,11 @@ "regl-line": "~1.1.1" } }, + "regression": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/regression/-/regression-2.0.1.tgz", + "integrity": "sha512-A4XYsc37dsBaNOgEjkJKzfJlE394IMmUPlI/p3TTI9u3T+2a+eox5Pr/CPUqF0eszeWZJPAc6QkroAhuUpWDJQ==" + }, "relateurl": { "version": "0.2.7", "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz", diff --git a/app/package.json b/app/package.json index 3c4918d494..092c6617fb 100644 --- a/app/package.json +++ b/app/package.json @@ -33,6 +33,7 @@ "chartjs-chart-geo": "^2.1.0", "chartjs-plugin-annotation": "^0.5.7", "chartjs-plugin-datalabels": "^0.7.0", + "chartjs-plugin-regression": "^0.2.1", "chartjs-plugin-zoom": "^0.7.7", "colormap": "^2.3.2", "core-js": "^3.6.4", diff --git a/app/public/css/gtif.scss b/app/public/css/gtif.scss index 93a7c3a249..6cf91525d8 100644 --- a/app/public/css/gtif.scss +++ b/app/public/css/gtif.scss @@ -45,4 +45,9 @@ .v-expansion-panel-header { text-transform: uppercase; +} + +/* Overwrite of coordinate div position because in gtif it is misaligned */ +.ol-control.ol-mouse-position { + top: -78px; } \ No newline at end of file diff --git a/app/src/components/DataMockupView.vue b/app/src/components/DataMockupView.vue index b84fafff11..e4504a884a 100644 --- a/app/src/components/DataMockupView.vue +++ b/app/src/components/DataMockupView.vue @@ -147,7 +147,7 @@ export default { show() { return this.selectedFeatures?.length && this.indicatorObject && ['SOL1', 'SOL1_1', 'SOL1_2', 'SOL1_3', 'SOL1_4', 'SOL1_5', 'SOL1_6', 'SOL1_7', - 'SOL2', 'SOL2_1', 'SOL2_2', 'SOL2_3', + 'SOL2', 'SOL2_1', 'SOL2_2', 'SOL2_3', 'HAUC2', ].includes(this.indicatorObject.indicator); // for now we set manually where we want the mockup to appear }, @@ -379,6 +379,34 @@ export default { }); }); } + if (['HAUC2'].includes(this.indicatorObject.indicator)) { + const adminIds = []; + features.forEach((ftr) => { + adminIds.push(ftr.getId()); + }); + const expUrl = 'https://eox-gtif-public.s3.eu-central-1.amazonaws.com/HeatAdapt/update/2024_stats.json'; + fetch(expUrl) + .then((resp) => resp.json()) + .then((json) => { + // Load only selected gemeinde + const dataArray = []; + adminIds.forEach((key) => { + if (key in json) { + dataArray.push(json[key]); + } + }); + const ind = { + ...this.indicatorObject, + fetchedData: dataArray, + xAxis: 'Soil sealing percentage [%]', + yAxis: 'Average temperature [°]', + }; + this.$store.commit( + 'indicators/CUSTOM_AREA_INDICATOR_LOAD_FINISHED', ind, + ); + window.dispatchEvent(new CustomEvent('set-custom-area-indicator-loading', { detail: false })); + }); + } if (['AQ1', // 'AQ1_1', 'AQ1_2', 'AQ1_3', 'AQ1_4', 'AQ1_5', 'AQ1_6'].includes(this.indicatorObject.indicator)) { diff --git a/app/src/components/IndicatorData.vue b/app/src/components/IndicatorData.vue index 42a6ded2b1..653931a158 100644 --- a/app/src/components/IndicatorData.vue +++ b/app/src/components/IndicatorData.vue @@ -144,7 +144,7 @@ export default { ], scatterChartIndicators: [ 'SOL1', 'SOL1_1', 'SOL1_2', 'SOL1_3', 'SOL1_4', 'SOL1_5', 'SOL1_6', 'SOL1_7', 'SOL2', 'SOL2_1', 'SOL2_2', 'SOL2_3', 'REP4_5', 'AQ1', // 'AQ1_1', - 'AQ1_2', 'AQ1_3', 'AQ1_4', 'AQ1_5', 'AQ1_6', + 'AQ1_2', 'AQ1_3', 'AQ1_4', 'AQ1_5', 'AQ1_6', 'HAUC2', ], multiYearComparison: [ 'E13e', 'E13f', 'E13g', 'E13h', 'E13i', 'E13l', 'E13m', @@ -1309,6 +1309,35 @@ export default { pointRadius: 2, }); }); + } else if (['HAUC2'].includes(indicatorCode)) { + // Rendering for fetched data for rooftops + featureData.fetchedData.forEach((valArray, ind) => { + // for each gemeinde group into a dataset + const x = []; + const y = []; + const clrs = []; + valArray.forEach((value, idx) => { + x.push(idx); + y.push(value); + clrs.push(refColors[ind]); + }); + const data = x.map((mm, j) => ( + { x: mm, y: y[j] } + )); + datasets.push({ + fill: false, + data, + backgroundColor: clrs, + borderColor: clrs, + borderWidth: 1, + pointRadius: 2, + regressions: { + type: 'polynomial', + line: { color: refColors[ind], width: 2 }, + calculation: { precision: 6, order: 3 }, + }, + }); + }); } else if (['REP4_5'].includes(indicatorCode)) { // Rendering for reservoirs LAC curve const data = featureData.referenceValue.map((x, i) => ( @@ -1530,6 +1559,41 @@ export default { // just one default yAxis customSettings.yAxis = [this.indicatorObject.yAxis]; + if (['HAUC2'].includes(indicatorCode)) { + customSettings.plugins = { + regressions: { + onCompleteCalculation: (chart) => { + // remove potential previous div + const preEl = document.getElementById('regressionresult'); + if (preEl) { + preEl.remove(); + } + const parentDiv = document.createElement('div'); + parentDiv.id = 'regressionresult'; + parentDiv.style.position = 'absolute'; + parentDiv.style.top = '105px'; + parentDiv.style['margin-left'] = '60px'; + parentDiv.style['font-size'] = '12px'; + chart.data.datasets.forEach((val, idx) => { + // currently we do not use sections so we assume sections with length 1 + const { sections } = ChartRegressions.getDataset(chart, idx); + if (sections && sections.length > 0) { + const { result } = sections[0]; + const divEl = document.createElement('div'); + divEl.style.color = `${this.appConfig.refColors[idx]}`; + const content = document.createTextNode(`R²: ${Number(result.r2).toFixed(3)}`); + divEl.appendChild(content); + parentDiv.appendChild(divEl); + } + }); + chart.canvas.parentElement.parentElement.appendChild(parentDiv); + }, + }, + datalabels: { + display: false, + }, + }; + } if (!Number.isNaN(reference) && ['E13b', 'E200'].includes(indicatorCode)) { annotations.push({ ...defaultAnnotationSettings, diff --git a/app/src/components/IndicatorTimeSelection.vue b/app/src/components/IndicatorTimeSelection.vue index 19e3a69e60..ed67de69c3 100644 --- a/app/src/components/IndicatorTimeSelection.vue +++ b/app/src/components/IndicatorTimeSelection.vue @@ -179,7 +179,7 @@ export default { return this.compareActive; }, showTimeSlider() { - return this.appConfig.id === 'gtif' || this.indicator?.showTimeSlider; + return (this.appConfig.id === 'gtif' && !this.indicator.disableTimeSlider) || this.indicator?.showTimeSlider; }, }, created() { diff --git a/app/src/components/UiPanelsLayout.vue b/app/src/components/UiPanelsLayout.vue index 319329e723..7c66d47d33 100644 --- a/app/src/components/UiPanelsLayout.vue +++ b/app/src/components/UiPanelsLayout.vue @@ -55,6 +55,7 @@ export default { id: 1, title: this.indicatorPanelheader, heightPercentage: 100, + heightPercentageBothOpen: 70, }, ]; this.panels.right = []; diff --git a/app/src/components/map/CogOverwriteControls.vue b/app/src/components/map/CogOverwriteControls.vue new file mode 100644 index 0000000000..93de793e6b --- /dev/null +++ b/app/src/components/map/CogOverwriteControls.vue @@ -0,0 +1,104 @@ + + + + + diff --git a/app/src/config/gtif.js b/app/src/config/gtif.js index c4402f1588..ccc3051177 100644 --- a/app/src/config/gtif.js +++ b/app/src/config/gtif.js @@ -92,6 +92,30 @@ const whitered = [ { index: stp * 7, rgb: [127, 39, 4] }, ]; +const heatadaptCM = [ + { index: 0, rgb: [43, 131, 186] }, + { index: 0.25, rgb: [171, 221, 164] }, + { index: 0.5, rgb: [255, 255, 191] }, + { index: 0.75, rgb: [253, 174, 97] }, + { index: 1, rgb: [215, 25, 28] }, +]; + +const heatadaptImperviousness = [ + { index: 0, rgb: [255, 253, 188] }, + { index: 1, rgb: [255, 180, 4] }, +]; + +// stp = 1 / 6; +// const heatadaptReds = [ +// { index: 0, rgb: [255, 245, 240] }, +// { index: stp * 1, rgb: [254, 224, 210] }, +// { index: stp * 2, rgb: [252, 187, 161] }, +// { index: stp * 3, rgb: [252, 146, 114] }, +// { index: stp * 4, rgb: [251, 106, 74] }, +// { index: stp * 5, rgb: [165, 15, 21] }, +// { index: stp * 6, rgb: [103, 0, 13] }, +// ]; + const blgrrd = { steps: 32, colors: colormap({ @@ -516,6 +540,14 @@ export const indicatorsDefinition = Object.freeze({ AQ1: { customAreaIndicator: true, }, + HAUC1: { + // customAreaIndicator: true, + baseLayers: solarAndGreenRoofDefaults, + }, + HAUC2: { + customAreaIndicator: true, + baseLayers: solarAndGreenRoofDefaults, + }, // commented out so that selection is disabled // AQ1_1: { // customAreaIndicator: true, @@ -1202,24 +1234,6 @@ function createSOL1Config(indicatorCode, selectedVariable) { queryParameters: { selected: 'lst30mme,grpotare5,grpotare20,grpotare45,co2red_05,co2red_20,co2red_45,grexisting', }, - highlights: [ - { - name: 'Graz', - location: wkt.read('POLYGON((15.24 47, 15.555 47, 15.555 47.11, 15.24 47.11, 15.24 47 ))').toJson(), - }, - { - name: 'Innsbruck', - location: wkt.read('POLYGON((11.2 47.2, 11.2 47.3, 11.6 47.3, 11.6 47.2, 11.2 47.2 ))').toJson(), - }, - { - name: 'St. Pölten', - location: wkt.read('POLYGON((15.55 48.16, 15.7 48.16, 15.7 48.23, 15.55 48.23, 15.55 48.16 ))').toJson(), - }, - { - name: 'Vienna', - location: wkt.read('POLYGON((16.19 48.12, 16.55 48.12, 16.55 48.295, 16.19 48.295, 16.19 48.12 ))').toJson(), - }, - ], wmsStyles: { sourceLayer: 'Green Roofs', items: [ @@ -1270,24 +1284,6 @@ function createSOL2Config(indicatorCode, selectedVariable) { queryParameters: { selected: 'pvusearea,pvexisting,pvpotentl,pveppmwhhp,pveppmwhrp,pveppmwhlp', }, - highlights: [ - { - name: 'Graz', - location: wkt.read('POLYGON((15.24 47, 15.555 47, 15.555 47.11, 15.24 47.11, 15.24 47 ))').toJson(), - }, - { - name: 'Innsbruck', - location: wkt.read('POLYGON((11.2 47.2, 11.2 47.3, 11.6 47.3, 11.6 47.2, 11.2 47.2 ))').toJson(), - }, - { - name: 'St. Pölten', - location: wkt.read('POLYGON((15.55 48.16, 15.7 48.16, 15.7 48.23, 15.55 48.23, 15.55 48.16 ))').toJson(), - }, - { - name: 'Vienna', - location: wkt.read('POLYGON((16.19 48.12, 16.55 48.12, 16.55 48.295, 16.19 48.295, 16.19 48.12 ))').toJson(), - }, - ], wmsStyles: { sourceLayer: 'Solar Roofs', items: [ @@ -1330,6 +1326,185 @@ function createSOL2Config(indicatorCode, selectedVariable) { } export const globalIndicators = [ + { + properties: { + indicatorObject: { + indicator: 'HAUC1', + time: [ + ['2022', '2022_LST_AT_merged_composite_mean_70m_3857.tif'], + ['2023', '2023_LST_AT_merged_composite_mean_70m_3857.tif'], + ['2024', '2024_LST_AT_merged_composite_mean_70m_3857.tif'], + ], + cogFilters: { + sourceLayer: 'HAUC1', + filters: { + var: { + display: true, + label: 'Imperviosness [%]', + id: 'var', + min: 0, + max: 100, + range: [0, 100], + }, + forests: { + display: true, + type: 'boolfilter', + label: 'Forest type coverage', + id: 'forests', + value: 0, + }, + crops: { + display: true, + type: 'boolfilter', + label: 'Crop type coverage', + id: 'crops', + value: 0, + }, + grasslands: { + display: true, + type: 'boolfilter', + label: 'Grassland type coverage', + id: 'grasslands', + value: 0, + }, + settlements: { + display: true, + type: 'boolfilter', + label: 'Settlement type coverage', + id: 'settlements', + value: 0, + }, + }, + }, + display: [ + { + protocol: 'cog', + disableTimeSlider: true, + id: 'HAUC1', + sources: [ + { url: 'https://eox-gtif-public.s3.eu-central-1.amazonaws.com/HeatAdapt/update/{time}' }, + { url: 'https://eox-gtif-public.s3.eu-central-1.amazonaws.com/HeatAdapt/update/IMD_2018_AT_70m_3857.tif' }, + { url: 'https://eox-gtif-public.s3.eu-central-1.amazonaws.com/HeatAdapt/update/LULUCF_2018_AT_70m_3857.tif' }, + ], + dateFormatFunction: (date) => `${date[1]}`, + labelFormatFunction: (date) => date[0], + style: { + variables: { + varMin: 0, + varMax: 100, + forests: 0, + crops: 0, + grasslands: 0, + settlements: 0, + }, + color: [ + 'case', + [ + 'all', + ['!=', ['band', 4], 0], + ['between', + ['band', 2], + ['var', 'varMin'], + ['var', 'varMax'], + /* assuming a stretch from 0 to 255 but it seems to not be used + ['*', ['var', 'varMin'], 2.55], + ['*', ['var', 'varMax'], 2.55], + */ + ], + // if no coverage filter is selected show all data + [ + 'case', + ['all', + ['==', ['var', 'forests'], 0], + ['==', ['var', 'crops'], 0], + ['==', ['var', 'grasslands'], 0], + ['==', ['var', 'settlements'], 0], + ], + 1, + [ + 'any', + ['all', ['==', ['var', 'forests'], 1], ['between', ['band', 3], 100, 200]], + ['all', ['==', ['var', 'crops'], 1], ['between', ['band', 3], 200, 300]], + ['all', ['==', ['var', 'grasslands'], 1], ['between', ['band', 3], 300, 400]], + ['all', ['==', ['var', 'settlements'], 1], ['between', ['band', 3], 500, 600]], + ], + ], + ], + [ + 'interpolate', + ['linear'], + ['band', 1], + ...getColorStops(heatadaptCM, 0, 40, 40, false), + ], + [ + 'color', 0, 0, 0, 0, + ], + ], + }, + }, + { + protocol: 'cog', + id: 'LULUCF', + sources: [ + { url: 'https://eox-gtif-public.s3.eu-central-1.amazonaws.com/HeatAdapt/update/LULUCF_2018_AT_70m_3857_rendered.tif' }, + ], + name: 'Land Cover', + normalize: true, + visible: false, + style: {}, + }, + { + protocol: 'cog', + id: 'imperviousness', + sources: [ + { url: 'https://eox-gtif-public.s3.eu-central-1.amazonaws.com/HeatAdapt/update/IMD_2018_AT_70m_3857.tif' }, + ], + name: 'Imperviousness', + visible: false, + style: { + color: [ + 'case', + ['>', ['band', 1], 0], + [ + 'interpolate', + ['linear'], + ['band', 1], + ...getColorStops(heatadaptImperviousness, 1, 100, 32), + ], + ['color', 0, 0, 0, 0], + ], + }, + }, + ], + }, + }, + }, + { + properties: { + indicatorObject: { + indicator: 'HAUC2', + time: [], + display: [ + { + layerName: 'geodb_debd884d-92f9-4979-87b6-eadef1139394:GTIF_AT_Gemeinden_3857', + protocol: 'geoserverTileLayer', + style: { + strokeColor: 'rgba(50,50,50,1)', + color: 'rgba(0,0,0,0)', + strokeWidth: 0.5, + }, + id: 'gemeinde_lst', + name: 'Administrative zone (Gemeinde)', + selection: { + mode: 'multiple', + }, + tooltip: true, + allowedParameters: ['name'], + }, + ], + }, + }, + }, createREP1Config('REP1', 'https://eox-gtif-public.s3.eu-central-1.amazonaws.com/DHI/PowerDensity_200m_Austria_WGS84_COG_clipped_3857_fix.tif'), createREP1Config('REP1_1', 'https://eox-gtif-public.s3.eu-central-1.amazonaws.com/DHI/PowerDensity_100m_Austria_WGS84_COG_clipped_3857_fix.tif'), createREP1Config('REP1_2', 'https://eox-gtif-public.s3.eu-central-1.amazonaws.com/DHI/PowerDensity_50m_Austria_WGS84_COG_clipped_3857_fix.tif'), @@ -2142,12 +2317,6 @@ export const globalIndicators = [ properties: { indicatorObject: { indicator: 'VTT', - highlights: [ - { - name: 'Styria overview', - location: wkt.read('POLYGON((13.234 48, 13.234 46.5, 16.5 46.5, 16.5 48, 13.234 48))').toJson(), - }, - ], cogFilters: { sourceLayer: 'VTT', filters: { @@ -2299,20 +2468,6 @@ export const globalIndicators = [ properties: { indicatorObject: { indicator: 'FCM1', - highlights: [ - { - name: 'Styria overview', - location: wkt.read('POLYGON((13.234 48, 13.234 46.5, 16.5 46.5, 16.5 48, 13.234 48))').toJson(), - }, - { - name: 'Oberhaag', - location: wkt.read('POLYGON((15.290 46.707, 15.427 46.707, 15.427 46.640, 15.290 46.640, 15.290 46.707))').toJson(), - }, - { - name: 'Bruck an der Mur', - location: wkt.read('POLYGON((15.158 47.440, 15.312 47.440, 15.312 47.368, 15.158 47.368, 15.158 47.440))').toJson(), - }, - ], time: [ ['2021-09-01', 'NRT_FCM_Changes-2021-09_epsg3857.tif'], ['2021-10-01', 'NRT_FCM_Changes-2021-10_epsg3857.tif'], diff --git a/app/src/config/stories.json b/app/src/config/stories.json index 50c43ab1cd..36b3d8df04 100644 --- a/app/src/config/stories.json +++ b/app/src/config/stories.json @@ -15,6 +15,13 @@ "subtitle": "Read more about satellite data applications for environmental impacts on world cereal supply and demand", "image": "./data/story-images/Agriculture.jpeg", "imagePlaceholder": "./data/story-images/Agriculture_placeholder.jpeg" + }, + "new-storytelling-demo": { + "storyMarkdown": "./data/storytelling-md/new-storytelling-demo.md", + "title": "New Storytelling Demo", + "subtitle": "Read more about satellite data applications for environmental impacts on world cereal supply and demand", + "image": "./data/story-images/Agriculture.jpeg", + "imagePlaceholder": "./data/story-images/Agriculture_placeholder.jpeg" } }, "atmosphere": { diff --git a/app/src/config/trilateral.js b/app/src/config/trilateral.js index 202da7fe91..d2aa9eb62b 100644 --- a/app/src/config/trilateral.js +++ b/app/src/config/trilateral.js @@ -909,7 +909,7 @@ export const globalIndicators = [ indicatorObject: { indicator: 'SLSTR1', display: { - dateFormatFunction: (date) => `${DateTime.fromISO(date).set({ hour: 0, minute: 0, second: 0 }).toFormat("yyyy-MM-dd'T'HH:mm:ss")}/${DateTime.fromISO(date).set({ hour: 23, minute: 59, second: 0 }).toFormat("yyyy-MM-dd'T'HH:mm:ss")}` + dateFormatFunction: (date) => `${DateTime.fromISO(date).set({ hour: 0, minute: 0, second: 0 }).toFormat("yyyy-MM-dd'T'HH:mm:ss")}/${DateTime.fromISO(date).set({ hour: 23, minute: 59, second: 0 }).toFormat("yyyy-MM-dd'T'HH:mm:ss")}`, }, }, }, diff --git a/app/src/plugins/charts.js b/app/src/plugins/charts.js index b2ef1f8995..5bc7bc1aba 100644 --- a/app/src/plugins/charts.js +++ b/app/src/plugins/charts.js @@ -6,6 +6,7 @@ import ChartDataLabels from 'chartjs-plugin-datalabels'; // eslint-disable-line import * as ChartAnnotation from 'chartjs-plugin-annotation'; import * as ChartZoomPlugin from 'chartjs-plugin-zoom'; +import { ChartRegressions } from 'chartjs-plugin-regression'; /** * Used to show a small bar on the chart if the value is 0 @@ -198,4 +199,4 @@ const defaultConfig = { }; Chart.scaleService.registerScaleType('myLogScale', MyLogScale, defaultConfig); -Chart.plugins.register([ChartAnnotation, ChartZoomPlugin, showZeroPlugin]); +Chart.plugins.register([ChartAnnotation, ChartZoomPlugin, showZeroPlugin, ChartRegressions]); diff --git a/app/src/views/Dashboard.vue b/app/src/views/Dashboard.vue index 8b2faadd13..ed514c34f4 100644 --- a/app/src/views/Dashboard.vue +++ b/app/src/views/Dashboard.vue @@ -39,6 +39,7 @@ for="#centerMap" :titleProperty.prop="'name'" :tools.prop="['info', 'config', 'opacity', 'sort']" + height-percentage-both-open=30 :styleOverride.prop="appConfig.id === 'gtif' ?`button.icon[slot=opacity-icon]::before {content: url(${require('../../public/img/gtif/icons/circle-opacity.svg')}) !important;} button.icon[slot=info-icon]::before {content: url(${require('../../public/img/gtif/icons/drop-icon.svg')}) !important;} [data-type=vector] .title::before { content: ''!important; width: 0px!important; height: 0px!important; min-width: 0px!important; margin-right: 0px!important; } [data-type=raster] .title::before {content: ''!important; width: 0px!important; height: 0px!important; min-width: 0px!important; margin-right: 0px!important;}* {font-family: 'NotesESA' !important;}` :`* {font-family: 'NotesESA' !important;}`" class="pointerEvents">