andi/perfdb
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Activity

dashboard #1

Merged
andi merged 118 commits from dashboard into master 2024-09-29 06:47:35 +00:00
Conversation 0 Commits 118 Files Changed 130 +114 -55
19 changed files with 114 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit fb5c8ea019 - Show all commits

8
pdb-js/src/app/app.component.html
View File

@@ -1,13 +1,7 @@
<div id="main-toolbar">
<!--
<a href="/">Home</a>
<a href="/"><img src="assets/img/home.svg" aria-hidden="false" aria-label="go to home page" /></a>
<a href="/vis" aria-label="go to visualization page">Visualization</a>
<a href="/dashboard" aria-label="go to dashboard page">Dashboards</a>
-->
<button mat-button [routerLink]="['/']"><img src="assets/img/home.svg" aria-hidden="false" aria-label="go to home page" /></button>
<button mat-button [routerLink]="['/']"><img src="assets/img/scatter-chart2.svg" aria-hidden="false" aria-label="go to home page" /> Plotilio</button>
<button mat-button [routerLink]="['/vis']">Visualization</button>
<button mat-button [routerLink]="['/dashboard']">Dashboards</button>
</div>

4
pdb-js/src/app/app.module.ts
View File

@@ -37,6 +37,7 @@ import { DashboardComponent } from './dashboard-page/dashboard/dashboard.compone
import { AddTextDialogComponent } from './dashboard-page/dashboard/add-text-dialog/add-text-dialog.component';
import { TextWidgetComponent } from './dashboard-page/dashboard/text-widget/text-widget.component';
import { AddPlotDialogComponent } from './dashboard-page/dashboard/add-plot-dialog/add-plot-dialog.component';
import { PlotWidgetComponent } from './dashboard-page/dashboard/plot-widget/plot-widget.component';
@NgModule({
declarations: [
@@ -59,7 +60,8 @@ import { AddPlotDialogComponent } from './dashboard-page/dashboard/add-plot-dial
DashboardComponent,
AddTextDialogComponent,
TextWidgetComponent,
AddPlotDialogComponent
AddPlotDialogComponent,
PlotWidgetComponent
],
imports: [
BrowserModule,

2
pdb-js/src/app/dashboard-page/dashboard/add-plot-dialog/add-plot-dialog.component.html
View File

@@ -14,7 +14,7 @@
</style>
<h1 mat-dialog-title>Add Plot</h1>
<pdb-visualization-page mat-dialog-content></pdb-visualization-page>
<pdb-visualization-page mat-dialog-content #plot></pdb-visualization-page>
<div mat-dialog-actions align="end">
<button mat-button mat-dialog-close>Cancel</button>

6
pdb-js/src/app/dashboard-page/dashboard/add-plot-dialog/add-plot-dialog.component.ts
View File

@@ -1,5 +1,6 @@
import { Component, ElementRef, ViewChild } from '@angular/core';
import { MatDialogRef } from '@angular/material/dialog';
import { VisualizationPageComponent } from 'src/app/visualization-page/visualization-page.component';
@Component({
selector: 'app-add-plot-dialog',
@@ -8,10 +9,13 @@ import { MatDialogRef } from '@angular/material/dialog';
})
export class AddPlotDialogComponent {
@ViewChild("plot") plotElement! :VisualizationPageComponent;
constructor(public dialogRef: MatDialogRef<string>){
}
onSaveClick(): void {
this.dialogRef.close("todo");
const config = this.plotElement.createPlotConfig();
this.dialogRef.close(config);
}
}

18
pdb-js/src/app/dashboard-page/dashboard/dashboard.component.html
View File

@@ -1,3 +1,20 @@
<style>
:host {
width: 100%;
height: 100%;
}
.spinner {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.content {
padding: 0.5em;
}
</style>
<div *ngIf="dashboard === undefined" class="spinner">
<mat-spinner></mat-spinner>
</div>
@@ -11,4 +28,5 @@
<p>{{dashboard.description}}</p>
<app-text-widget *ngFor="let textWidget of dashboard.texts" [text]="textWidget.text"></app-text-widget>
<app-plot-widget *ngFor="let plotWidget of dashboard.plots" [data]="plotWidget"></app-plot-widget>
</div>

15
pdb-js/src/app/dashboard-page/dashboard/dashboard.component.scss
View File

@@ -1,15 +0,0 @@
:host {
width: 100%;
height: 100%;
}
.spinner {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.content {
padding: 0.5em;
}

12
pdb-js/src/app/dashboard-page/dashboard/dashboard.component.ts
View File

@@ -2,14 +2,14 @@ import { Component, OnInit } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { ActivatedRoute } from '@angular/router';
import { Dashboard, DashboardService, TextWidget } from 'src/app/dashboard.service';
import { Dashboard, DashboardService, PlotWidget, TextWidget } from 'src/app/dashboard.service';
import { PlotConfig } from 'src/app/plot.service';
import { AddPlotDialogComponent } from './add-plot-dialog/add-plot-dialog.component';
import { AddTextDialogComponent } from './add-text-dialog/add-text-dialog.component';
@Component({
selector: 'app-dashboard',
templateUrl: './dashboard.component.html',
styleUrls: ['./dashboard.component.scss']
templateUrl: './dashboard.component.html'
})
export class DashboardComponent implements OnInit {
@@ -34,9 +34,9 @@ export class DashboardComponent implements OnInit {
addPlot() {
this.dialog.open(AddPlotDialogComponent,{
width: 'calc(100% - 1em)',
//height: 'calc(100% - 1em)'
}).afterClosed().subscribe((text: string) => {
//this.dashboard!.texts.push(new TextWidget('MEDIUM', text));
height: 'calc(100% - 1em)'
}).afterClosed().subscribe((config: PlotConfig) => {
this.dashboard!.plots.push(new PlotWidget('MEDIUM', config));
});
}

4
pdb-js/src/app/dashboard-page/dashboard/plot-widget/plot-widget.component.html Normal file
View File

@@ -0,0 +1,4 @@
<style>
</style>
<p>{{data.config.query}}</p>

23
pdb-js/src/app/dashboard-page/dashboard/plot-widget/plot-widget.component.spec.ts Normal file
View File

@@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { PlotWidgetComponent } from './plot-widget.component';
describe('PlotWidgetComponent', () => {
let component: PlotWidgetComponent;
let fixture: ComponentFixture<PlotWidgetComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ PlotWidgetComponent ]
})
.compileComponents();
fixture = TestBed.createComponent(PlotWidgetComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

13
pdb-js/src/app/dashboard-page/dashboard/plot-widget/plot-widget.component.ts Normal file
View File

@@ -0,0 +1,13 @@
import { Component, Input } from '@angular/core';
import { PlotWidget } from 'src/app/dashboard.service';
@Component({
selector: 'app-plot-widget',
templateUrl: './plot-widget.component.html'
})
export class PlotWidgetComponent {
@Input("data")
data!: PlotWidget;
}

5
pdb-js/src/app/dashboard.service.ts
View File

@@ -1,6 +1,7 @@
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { PlotConfig } from './plot.service';
@Injectable({
providedIn: 'root'
@@ -32,7 +33,7 @@ export class DashboardCreationData{
}
export class Dashboard{
constructor(public id: string, public name: string, public description: string, public texts: [TextWidget]){}
constructor(public id: string, public name: string, public description: string, public texts: TextWidget[], public plots: PlotWidget[]){}
}
export class DashboardList{
@@ -49,7 +50,7 @@ export class TextWidget extends BaseWidget {
}
}
export class PlotWidget extends BaseWidget {
constructor(override size: 'SMALL'|'MEDIUM'|'LARGE') {
constructor(override size: 'SMALL'|'MEDIUM'|'LARGE', public config: PlotConfig) {
super('PLOT', size);
}
}

2
pdb-js/src/app/visualization-page/visualization-page.component.scss
View File

@@ -1,7 +1,7 @@
:host{
font-weight: bold;
width: 100%;
height: calc(100% - 29px);
height: calc(100% - 43px);
position: absolute;
display: grid;
}

10
pdb-js/src/app/visualization-page/visualization-page.component.ts
View File

@@ -181,13 +181,12 @@ export class VisualizationPageComponent implements OnInit {
});
}
createPlotRequest(): PlotRequest {
createPlotConfig(): PlotConfig {
const aggregates = new Array<string>();
this.selectedPlotType.forEach(a => aggregates.push(a.id));
const y1 = this.y1AxisDefinitionComponent.getAxisDefinition();
const y2 = this.y2AxisDefinitionComponent ? this.y2AxisDefinitionComponent.getAxisDefinition() : undefined;
const results = document.getElementById("results");
const config = new PlotConfig(
this.query.query,
@@ -202,6 +201,13 @@ export class VisualizationPageComponent implements OnInit {
this.intervalValue,
this.renderBarChartTickLabels,
);
return config;
}
createPlotRequest(): PlotRequest {
const results = document.getElementById("results");
const config = this.createPlotConfig();
const request = new PlotRequest(
results != null ? results.offsetHeight-1: 1024,

4
pdb-plotting/src/main/java/org/lucares/pdb/plot/api/ScatterAggregator.java
View File

@@ -45,8 +45,8 @@ public class ScatterAggregator implements CustomAggregator {
final YAxisDefinition yAxisDefinition = plotSettings.getyAxisDefinition(yAxis);
final boolean automaticRange = yAxisDefinition.getRangeUnit().isAutomatic();
minValue = automaticRange ? 0 : yAxisDefinition.getRangeMinForUnit();
maxValue = automaticRange ? Long.MAX_VALUE : yAxisDefinition.getRangeMaxForUnit();
minValue = automaticRange ? 0 : yAxisDefinition.rangeMinForUnit();
maxValue = automaticRange ? Long.MAX_VALUE : yAxisDefinition.rangeMaxForUnit();
valuesPerPixel = yAxisDefinition.getAxisScale() == AxisScale.LINEAR && !automaticRange
? Math.max(1, (maxValue - minValue) / plotAreaHeightInPx)
: 1;

8
pdb-plotting/src/main/java/org/lucares/pdb/plot/api/YAxisDefinition.java
View File

@@ -15,11 +15,11 @@ public class YAxisDefinition {
this.axisScale = axisScale;
}
public long getRangeMinForUnit() {
public long rangeMinForUnit() {
return rangeUnit.valueForUnit(rangeMin);
}
public long getRangeMaxForUnit() {
public long rangeMaxForUnit() {
return rangeUnit.valueForUnit(rangeMax);
}
@@ -51,8 +51,4 @@ public class YAxisDefinition {
this.rangeUnit = rangeUnit;
}
public boolean isLogscale() {
return axisScale == AxisScale.LOG10;
}
}

6
pdb-plotting/src/main/java/org/lucares/recommind/logs/AxisTime.java
View File

@@ -52,15 +52,15 @@ public class AxisTime {
final int graphOffset = yAxisDefinition.getAxisScale() == AxisScale.LINEAR ? 0 : 1;
if (yAxisDefinition.hasRange()) {
final long min = Math.max(yAxisDefinition.getRangeMinForUnit(), graphOffset);
final long max = yAxisDefinition.getRangeMaxForUnit();
final long min = Math.max(yAxisDefinition.rangeMinForUnit(), graphOffset);
final long max = yAxisDefinition.rangeMaxForUnit();
result.setFrom(String.valueOf(min));
result.setTo(String.valueOf(max));
} else {
result.setFrom(String.valueOf(graphOffset));
}
result.setLogscale(yAxisDefinition.isLogscale());
result.setLogscale(yAxisDefinition.getAxisScale() == AxisScale.LOG10);
result.setTics(YAxisTicks.computeYTicks(settings, yAxis, dataSeries));
result.setShowGrid(yAxis == GnuplotAxis.Y1);

4
pdb-plotting/src/main/java/org/lucares/recommind/logs/YAxisTicks.java
View File

@@ -25,8 +25,8 @@ class YAxisTicks {
final long yRangeMax;
final long yRangeMin;
if (yAxisDefinition.hasRange()) {
yRangeMin = yAxisDefinition.getRangeMinForUnit();
yRangeMax = yAxisDefinition.getRangeMaxForUnit();
yRangeMin = yAxisDefinition.rangeMinForUnit();
yRangeMax = yAxisDefinition.rangeMaxForUnit();
} else {
yRangeMin = 0;
yRangeMax = DataSeries.maxValue(dataSeries);

9
pdb-ui/src/main/java/org/lucares/pdbui/dashboard/Dashboard.java
View File

@@ -22,6 +22,8 @@ public class Dashboard {
private List<TextWidget> texts = new ArrayList<>();
private List<PlotWidget> plots = new ArrayList<>();
public Dashboard() {
super();
@@ -68,4 +70,11 @@ public class Dashboard {
this.texts = texts;
}
public void setPlots(final List<PlotWidget> plots) {
this.plots = plots;
}
public List<PlotWidget> getPlots() {
return plots;
}
}

12
pdb-ui/src/main/java/org/lucares/pdbui/dashboard/PlotWidget.java
View File

@@ -1,12 +1,16 @@
package org.lucares.pdbui.dashboard;
import org.lucares.pdbui.domain.PlotConfig;
public class PlotWidget extends BaseDashboardWidget {
public PlotWidget() {
super();
private PlotConfig config;
public PlotConfig getConfig() {
return config;
}
public PlotWidget(final DashboardWidgetSize size) {
super(DashboardWidgetType.PLOT, size);
public void setConfig(final PlotConfig config) {
this.config = config;
}
}