query-window.component.ts 1.92 KB
Newer Older
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
import { Component, OnInit } from '@angular/core';
import {CacheService} from '../cache.service';

@Component({
  selector: 'app-query-window',
  templateUrl: './query-window.component.html',
  styleUrls: ['./query-window.component.css']
})
export class QueryWindowComponent implements OnInit {

  public plot;

  constructor(private service: CacheService) { }

  ngOnInit(): void {
    this.service.onNewQuery.subscribe(() => {
17
      if (this.service.queryWindow) {
18
19
20
21
22
23
        this.initializePlot();
      }
    });
  }

  initializePlot(): void {
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
    const data = [];
    this.service.queryWindow.forEach((channel, index) => {
      data.push({
        x: [...Array(channel.length).keys()],
        y: channel,
        type: 'line',
        xaxis: 'x',
        yaxis: `y${index + 2}`,
      });
    });
    const subplots = [];
    this.service.queryWindow.forEach((channel, index) => {
      subplots.push([`xy${index + 2}`]);
    });
    const plot =
39
      {
40
        data: data,
41
        layout: {
42
43
44
45
46
          grid: {
            rows: this.service.queryWindow.length,
            columns: 1,
            subplots: subplots,
          },
47
48
49
          hovermode: 'closest',
          autosize: true,
          margin: {
50
            l: 50,
51
52
            r: 30,
            t: 30,
Kruyff,D.L.W. (Dylan)'s avatar
Kruyff,D.L.W. (Dylan) committed
53
            b: 5,
54
55
            pad: 4
          },
56
          height: 300,
57
58
59
60
          width: 150,
          titlefont: {
            size: 9
          },
61
          showlegend: false,
Kruyff,D.L.W. (Dylan)'s avatar
Kruyff,D.L.W. (Dylan) committed
62
          xaxis: {
Kruyff,D.L.W. (Dylan)'s avatar
Kruyff,D.L.W. (Dylan) committed
63
64
            showgrid: false,
            zeroline: false,
Kruyff,D.L.W. (Dylan)'s avatar
Kruyff,D.L.W. (Dylan) committed
65
66
            showticklabels: false,
          }
67
68
        }
      };
69
70
71
72
73
74
75
76
    this.service.queryWindow.forEach((channel, index) => {
      plot.layout[`yaxis${index + 2}`] = {
        zeroline: false,
        showticklabels: false,
      };
    });
    this.plot = plot;
    console.log(this.plot);
77
78
  }

79
80
  get isQuerySet(): boolean {
    return !!this.service.queryWindow;
81
  }
Kruyff,D.L.W. (Dylan)'s avatar
Kruyff,D.L.W. (Dylan) committed
82
83
84
85

  public newQuery() {
    this.service.querySelectionMode = true;
  }
86
}