|
@@ -9,25 +9,6 @@ import {SdmDihService} from '../sdm-dih.service';
|
|
|
})
|
|
})
|
|
|
export class AllInOneGraphComponent {
|
|
export class AllInOneGraphComponent {
|
|
|
dataLoaded = false;
|
|
dataLoaded = false;
|
|
|
- /*trace1 = {
|
|
|
|
|
- x: [2014, 2014, 2014, 2015, 2015, 2016, 2030],
|
|
|
|
|
- y: [
|
|
|
|
|
- 'Monaghan',
|
|
|
|
|
- 'Hame',
|
|
|
|
|
- 'Central Greece',
|
|
|
|
|
- 'Central Bohemia',
|
|
|
|
|
- 'Segobriga',
|
|
|
|
|
- 'Segobriga',
|
|
|
|
|
- 'Galilee',
|
|
|
|
|
- ],
|
|
|
|
|
- mode: 'markers',
|
|
|
|
|
- marker: {
|
|
|
|
|
- size: 10,
|
|
|
|
|
- color: [0, 0.1, 0.2, 0.5, 0.4, 0.3, 0],
|
|
|
|
|
- colorscale: 'YlOrRd',
|
|
|
|
|
- },
|
|
|
|
|
- type: 'scatter',
|
|
|
|
|
- };*/
|
|
|
|
|
data = [];
|
|
data = [];
|
|
|
layout = {
|
|
layout = {
|
|
|
height: 400,
|
|
height: 400,
|
|
@@ -39,7 +20,6 @@ export class AllInOneGraphComponent {
|
|
|
this.processData();
|
|
this.processData();
|
|
|
this.dataLoaded = true;
|
|
this.dataLoaded = true;
|
|
|
});
|
|
});
|
|
|
- //this.drawPlot();
|
|
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
processData() {
|
|
processData() {
|
|
@@ -55,56 +35,21 @@ export class AllInOneGraphComponent {
|
|
|
colors.push(regionData[PARAM_TO_COMPARE]);
|
|
colors.push(regionData[PARAM_TO_COMPARE]);
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
- /*const years = Object.keys(this.sdmDihService.sdmData).map((year) =>
|
|
|
|
|
- parseFloat(year)
|
|
|
|
|
- );
|
|
|
|
|
- const regions = [
|
|
|
|
|
- ...new Set<string>(
|
|
|
|
|
- this.sdmDihService.sdmData[years[1] + ''].map(
|
|
|
|
|
- (yearData) => yearData['MODEL']
|
|
|
|
|
- )
|
|
|
|
|
- ),
|
|
|
|
|
- ];*/
|
|
|
|
|
const trace1 = {
|
|
const trace1 = {
|
|
|
x: years,
|
|
x: years,
|
|
|
y: regions,
|
|
y: regions,
|
|
|
mode: 'markers',
|
|
mode: 'markers',
|
|
|
marker: {
|
|
marker: {
|
|
|
size: 10,
|
|
size: 10,
|
|
|
- color: colors, //[0, 0.1, 0.2, 0.5, 0.4, 0.3, 0],
|
|
|
|
|
- colorscale: 'YlOrRd',
|
|
|
|
|
|
|
+ color: colors,
|
|
|
|
|
+ colorscale: [0, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1].map(
|
|
|
|
|
+ (perc) => {
|
|
|
|
|
+ return [perc, this.sdmDihService.perc2color(perc)];
|
|
|
|
|
+ }
|
|
|
|
|
+ ),
|
|
|
},
|
|
},
|
|
|
type: 'scatter',
|
|
type: 'scatter',
|
|
|
};
|
|
};
|
|
|
this.data = [trace1];
|
|
this.data = [trace1];
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
- /*drawPlot() {
|
|
|
|
|
- const trace1 = {
|
|
|
|
|
- y: [
|
|
|
|
|
- 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5,
|
|
|
|
|
- 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5, 5,
|
|
|
|
|
- ],
|
|
|
|
|
-
|
|
|
|
|
- mode: 'markers',
|
|
|
|
|
-
|
|
|
|
|
- marker: {
|
|
|
|
|
- size: 40,
|
|
|
|
|
-
|
|
|
|
|
- color: [
|
|
|
|
|
- 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19,
|
|
|
|
|
- 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36,
|
|
|
|
|
- 37, 38, 39,
|
|
|
|
|
- ],
|
|
|
|
|
- },
|
|
|
|
|
- };
|
|
|
|
|
-
|
|
|
|
|
- const data = [trace1];
|
|
|
|
|
-
|
|
|
|
|
- const layout = {
|
|
|
|
|
- title: 'Scatter Plot with a Color Dimension',
|
|
|
|
|
- };
|
|
|
|
|
-
|
|
|
|
|
- Plotly.newPlot('plot-place', data, layout);
|
|
|
|
|
- }*/
|
|
|
|
|
}
|
|
}
|