Update/fix plot params

This commit is contained in:
phil 2024-03-14 17:02:30 +05:30
parent 947389a852
commit 32363165ea
3 changed files with 51 additions and 46 deletions

View file

@ -12,7 +12,7 @@ import { Tag, TagAction } from './info-tags/tags.service'
import { ConfigService } from '../config.service' import { ConfigService } from '../config.service'
import { DataService } from '../_services/data.service' import { DataService } from '../_services/data.service'
import { ApiService, ModelInfo, FeatureInfo } from '../openapi' import { ApiService, ModelInfo, FeatureInfo, PlotParams } from '../openapi'
// const getModelInfoQuery = gql` // const getModelInfoQuery = gql`
// query modelInfo ($store: String!) { // query modelInfo ($store: String!) {
@ -346,37 +346,35 @@ export class LegendItem {
// } // }
// } // }
export class PlotBaseLine { // export class PlotBaseLine {
constructor( // constructor(
public name: string, // public name: string,
public value: number, // public value: number,
public color: string, // public color: string,
) {} // ) {}
} // }
export class PlotBgShape { // export class PlotBgShape {
constructor( // constructor(
public name: string, // public name: string,
public valueTop: number, // public valueTop: number,
public valueBottom: number, // public valueBottom: number,
public color: string, // public color: string,
) {} // ) {}
} // }
export class PlotParams { // export class PlotParams {
constructor( // constructor(
public baseLines: PlotBaseLine[] = [], // public baseLines: PlotBaseLine[] = [],
public bgShapes: PlotBgShape[] = [], // public bgShapes: PlotBgShape[] = [],
public barBase?: number // public barBase?: number
) {} // ) {}
} // }
export class PlotDataParams { export type PlotDataParams = {
constructor( data: Object[],
public data: Object, comment: string,
public comment: string, params: PlotParams
public params: PlotParams,
) {}
} }
export class InfoItem { export class InfoItem {
@ -547,15 +545,21 @@ export class InfoDataService {
this.dataService.getValues(store, +id, value, resampling), this.dataService.getValues(store, +id, value, resampling),
this.getPlotParams(store, id, value), this.getPlotParams(store, id, value),
]).pipe(map( ]).pipe(map(
res => new PlotDataParams( res => { return {
res[0].body, data: JSON.parse(res[0][0]),
res[0].headers['comment'], // comment: res[0].headers['comment'],
res[1], comment: res[0][1],
) params: res[1],
}}
)) ))
} }
getPlotParams(store: string, id: string, value: string): Observable<PlotParams> { getPlotParams(store: string, id: string, value: string): Observable<PlotParams> {
return this.api.getPlotParamsApiPlotParamsStoreGet({
'store': store,
'id': id,
'value': value
})
console.warn('Migrate Graphql') console.warn('Migrate Graphql')
return observableOf() return observableOf()
// return this.apollo.query({ // return this.apollo.query({

View file

@ -1,5 +1,6 @@
import { Component, OnInit, ViewChild, Input, AfterViewInit, import { Component, OnInit, ViewChild, Input, AfterViewInit,
ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core' ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'
import { MatSlideToggle } from '@angular/material/slide-toggle'
import { Observable, of } from 'rxjs' import { Observable, of } from 'rxjs'
import { map, catchError } from 'rxjs/operators' import { map, catchError } from 'rxjs/operators'
@ -10,8 +11,8 @@ import { MatSnackBar } from '@angular/material/snack-bar'
import { PlotlyComponent, PlotlyService } from 'angular-plotly.js' import { PlotlyComponent, PlotlyService } from 'angular-plotly.js'
import { DataService } from '../../_services/data.service' import { DataService } from '../../_services/data.service'
import { FullInfo, InfoDataService, PlotDataParams, PlotParams } from '../info-data.service' import { FullInfo, InfoDataService, PlotDataParams } from '../info-data.service'
import { MatSlideToggle } from '@angular/material/slide-toggle' import { PlotParams } from '../../openapi'
@Component({ @Component({
selector: 'gisaf-info-plot', selector: 'gisaf-info-plot',
@ -175,7 +176,7 @@ export class InfoPlotComponent implements OnInit, AfterViewInit {
) )
} }
createPlot(data: any, plotParams?: PlotParams) { createPlot(data: Object[], plotParams?: PlotParams) {
// Kept compatibility with previous API // Kept compatibility with previous API
const values = data.map(d => d[this.value]) const values = data.map(d => d[this.value])
this.plotData = [] this.plotData = []
@ -197,7 +198,7 @@ export class InfoPlotComponent implements OnInit, AfterViewInit {
} }
}, },
} }
if (plotParams.barBase) { if (plotParams?.barBase) {
plotData['base'] = plotParams.barBase plotData['base'] = plotParams.barBase
// Adjust the height of the bars // Adjust the height of the bars
plotData['y'] = plotData['y'].map(v => v - plotParams.barBase) plotData['y'] = plotData['y'].map(v => v - plotParams.barBase)
@ -206,7 +207,7 @@ export class InfoPlotComponent implements OnInit, AfterViewInit {
// Add plot "decorations" found in plotParams // Add plot "decorations" found in plotParams
//const xRange = [data[0].time, data[data.length-1].time] //const xRange = [data[0].time, data[data.length-1].time]
plotParams.baseLines.forEach( plotParams?.baseLines.forEach(
bl => { bl => {
this.plotData.push({ this.plotData.push({
x: this.xRange, x: this.xRange,
@ -221,7 +222,7 @@ export class InfoPlotComponent implements OnInit, AfterViewInit {
}) })
} }
) )
this.plotLayout['shapes'] = plotParams.bgShapes.map( this.plotLayout['shapes'] = plotParams?.bgShapes.map(
shape => { shape => {
return { return {
type: 'rect', type: 'rect',
@ -241,7 +242,7 @@ export class InfoPlotComponent implements OnInit, AfterViewInit {
} }
) )
// Fake plot, just to add legend entries // Fake plot, just to add legend entries
plotParams.bgShapes.forEach( plotParams?.bgShapes.forEach(
bl => { bl => {
this.plotData.push({ this.plotData.push({
x: [0], x: [0],
@ -263,12 +264,12 @@ export class InfoPlotComponent implements OnInit, AfterViewInit {
// Give some space around min and max values // Give some space around min and max values
this.minY = Math.min.apply(Math, values) this.minY = Math.min.apply(Math, values)
this.minEY = Math.min( this.minEY = Math.min(
Math.min.apply(Math, plotParams.baseLines.map(bl => bl.value)), Math.min.apply(Math, plotParams?.baseLines.map(bl => bl.value)),
this.minY this.minY
) )
this.maxY = Math.max.apply(Math, values) this.maxY = Math.max.apply(Math, values)
this.maxEY = Math.max( this.maxEY = Math.max(
Math.max.apply(Math, plotParams.baseLines.map(bl => bl.value)), Math.max.apply(Math, plotParams?.baseLines.map(bl => bl.value)),
this.maxY this.maxY
) )
this.borderY = (this.maxY - this.minY) * this.marginRatio this.borderY = (this.maxY - this.minY) * this.marginRatio

View file

@ -5,8 +5,8 @@
import type { PlotBaseLine } from './PlotBaseLine'; import type { PlotBaseLine } from './PlotBaseLine';
import type { PlotBgShape } from './PlotBgShape'; import type { PlotBgShape } from './PlotBgShape';
export type PlotParams = { export type PlotParams = {
baseLines: Array<PlotBaseLine>; baseLines?: Array<PlotBaseLine>;
bgShape: Array<PlotBgShape>; bgShapes?: Array<PlotBgShape>;
barBase: number; barBase?: (number | null);
}; };