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

more updates to handle date ranges with my custom range language

Browse Source
This commit is contained in:
Andreas Huber
2024-07-27 13:19:35 +02:00
parent 77b99801e4
commit a69fe09464
6 changed files with 108 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
pdb-js/src/app/plot-view/plot-view.component.ts
View File

@@ -7,6 +7,7 @@ import { Overlay } from "@angular/cdk/overlay";
import { DateTime, Duration } from "luxon";
import { DateValue } from '../components/datepicker/date-picker.component';
import { Observable } from 'rxjs';
@Component({
selector: 'pdb-plot-view',
@@ -190,11 +191,11 @@ export class PlotViewComponent {
}
zoomRange(range: SelectionRange) {
this.shiftDate(this.config?.dateRange.value!, range.startPercentOfDateRange, range.endPercentOfDateRange-1);
this.shiftDate(this.config?.dateRange!, range.startPercentOfDateRange, range.endPercentOfDateRange-1);
}
zoomWithDateAnchor(dateAnchor: DateAnchor){
this.shiftDateByAnchor(this.config?.dateRange.value!, dateAnchor.cursorPercentOfDateRange, dateAnchor.zoomFactor);
this.shiftDateByAnchor(this.config?.dateRange!, dateAnchor.cursorPercentOfDateRange, dateAnchor.zoomFactor);
}
zoomByScroll(event: WheelEvent) {
@@ -295,18 +296,27 @@ export class PlotViewComponent {
* shiftDateByAnchor(dateRangeAsString, 0.20, 0.5) zooms in by 50%, so that the date that was at 20% before the zoom is still at 20% after the zoom
* shiftDateByAnchor(dateRangeAsString, 0.33, 2) zooms out by 50%, so that the date that was at 33% before the zoom is still at 33% after the zoom
*/
shiftDateByAnchor(dateRange:string, anchorInPercentOfDateRange:number, zoomFactor:number)
shiftDateByAnchor(dateValue:DateValue, anchorInPercentOfDateRange:number, zoomFactor:number)
{
const dateRangeParsed = this.parseDateRange(dateRange);
const dateRangeInSeconds = Math.floor(dateRangeParsed.duration.toMillis()/1000);
debugger;
const dateRangeParsed = this.parseDateRange(dateValue);
dateRangeParsed.subscribe({
next: (dataRange: DateRange) => {
const dateRangeInSeconds = Math.floor(dataRange.duration.toMillis()/1000);
const anchorTimestampInSeconds = dateRangeParsed.startDate.plus(Math.floor(dateRangeInSeconds*anchorInPercentOfDateRange)*1000);
const newDateRangeInSeconds = dateRangeInSeconds * zoomFactor;
const anchorTimestampInSeconds = dataRange.startDate.plus(Math.floor(dateRangeInSeconds*anchorInPercentOfDateRange)*1000);
const newDateRangeInSeconds = dateRangeInSeconds * zoomFactor;
const newStartDate = anchorTimestampInSeconds.minus(newDateRangeInSeconds*anchorInPercentOfDateRange*1000);
const newEndDate = newStartDate.plus({seconds: newDateRangeInSeconds});;
this.setDateRange(newStartDate, newEndDate);
},
error: (err: any) => {
window.console.error("failed to parse DateValue into DateRange: ", err);
}
})
const newStartDate = anchorTimestampInSeconds.minus(newDateRangeInSeconds*anchorInPercentOfDateRange*1000);
const newEndDate = newStartDate.plus({seconds: newDateRangeInSeconds});;
this.setDateRange(newStartDate, newEndDate);
}
/**
@@ -318,27 +328,36 @@ export class PlotViewComponent {
* shiftDate(dateRangeAsString, -0.5, -0.5) will move the range by half its size to older values
* shiftDate(dateRangeAsString, 1, 1) will move the range by its size to newer values
*/
shiftDate(dateRange: string, factorStartDate: number, factorEndDate: number)
shiftDate(dateValue: DateValue, factorStartDate: number, factorEndDate: number)
{
const dateRangeParsed = this.parseDateRange(dateRange);
const dateRangeInSeconds = Math.floor(dateRangeParsed.duration.toMillis()/1000);
const newStartDate = dateRangeParsed.startDate.plus({seconds: dateRangeInSeconds*factorStartDate});
const newEndDate = dateRangeParsed.endDate.plus({seconds: dateRangeInSeconds*factorEndDate});
this.setDateRange(newStartDate, newEndDate);
debugger;
this.parseDateRange(dateValue).subscribe(
dateRangeParsed => {
const dateRangeInSeconds = Math.floor(dateRangeParsed.duration.toMillis()/1000);
const newStartDate = dateRangeParsed.startDate.plus({seconds: dateRangeInSeconds*factorStartDate});
const newEndDate = dateRangeParsed.endDate.plus({seconds: dateRangeInSeconds*factorEndDate});
this.setDateRange(newStartDate, newEndDate);
}
);
}
parseDateRange(dateRangeAsString : string) : DateRange {
const startDate = DateTime.fromFormat(dateRangeAsString.slice(0, 19), this.DATE_PATTERN );
const endDate = DateTime.fromFormat(dateRangeAsString.slice(22, 41), this.DATE_PATTERN );
return {
startDate: startDate,
endDate: endDate,
duration: endDate.diff(startDate),
};
parseDateRange(dateValue : DateValue) : Observable<DateRange> {
return this.service.toDateRange(dateValue);
/*
.pipe(map((dateRangeAsString:string) => {
const startDate = DateTime.fromFormat(dateRangeAsString.slice(0, 19), this.DATE_PATTERN );
const endDate = DateTime.fromFormat(dateRangeAsString.slice(22, 41), this.DATE_PATTERN );
return {
startDate: startDate,
endDate: endDate,
duration: endDate.diff(startDate),
};
}));
*/
}