1 | 'use strict'
|
2 |
|
3 | const d3 = require('./d3.js')
|
4 | const EventEmitter = require('events')
|
5 | const SubGraph = require('./sub-graph')
|
6 |
|
7 | class Graph extends EventEmitter {
|
8 | constructor () {
|
9 | super()
|
10 |
|
11 | this.data = null
|
12 | this.container = d3.select('#graph')
|
13 |
|
14 | this.cpu = new SubGraph(this.container, {
|
15 | className: 'cpu',
|
16 | name: 'CPU Usage',
|
17 | unit: '%',
|
18 | shortLegend: ['Usage'],
|
19 | showLegend: false,
|
20 | lineStyle: [''],
|
21 | numLines: 1,
|
22 | ymin: 0,
|
23 | ymax: 100
|
24 | })
|
25 |
|
26 | this.memory = new SubGraph(this.container, {
|
27 | className: 'memory',
|
28 | name: 'Memory Usage',
|
29 | unit: 'MB',
|
30 | longLegend: ['RSS', 'Total Heap Allocated', 'Heap Used'],
|
31 | shortLegend: ['RSS', 'THA', 'HU'],
|
32 | showLegend: true,
|
33 | lineStyle: ['1, 2', '5, 3', ''],
|
34 | numLines: 3,
|
35 | ymin: 0
|
36 | })
|
37 |
|
38 | this.delay = new SubGraph(this.container, {
|
39 | className: 'delay',
|
40 | name: 'Event Loop Delay',
|
41 | unit: 'ms',
|
42 | shortLegend: ['Delay'],
|
43 | showLegend: false,
|
44 | lineStyle: [''],
|
45 | numLines: 1,
|
46 | ymin: 0,
|
47 | interpolation: 'curveStepBefore'
|
48 | })
|
49 |
|
50 | this.handles = new SubGraph(this.container, {
|
51 | className: 'handles',
|
52 | name: 'Active Handles',
|
53 | unit: '',
|
54 | shortLegend: ['Handles'],
|
55 | showLegend: false,
|
56 | lineStyle: [''],
|
57 | numLines: 1,
|
58 | ymin: 0,
|
59 | interpolation: 'curveStepBefore'
|
60 | })
|
61 |
|
62 |
|
63 | for (const subgraph of [this.cpu, this.memory, this.delay, this.handles]) {
|
64 | subgraph.on('hover-update', (unitX) => this.emit('hover-update', unitX))
|
65 | subgraph.on('hover-show', () => this.emit('hover-show'))
|
66 | subgraph.on('hover-hide', () => this.emit('hover-hide'))
|
67 | subgraph.on('alert-click', () => this.emit('alert-click'))
|
68 | }
|
69 | }
|
70 |
|
71 | hoverUpdate (unitX) {
|
72 | if (this.data === null) {
|
73 | throw new Error('data not loaded')
|
74 | }
|
75 |
|
76 | const points = this.data.getPoints(unitX)
|
77 | this.cpu.hoverUpdate(points.cpu)
|
78 | this.memory.hoverUpdate(points.memory)
|
79 | this.delay.hoverUpdate(points.delay)
|
80 | this.handles.hoverUpdate(points.handles)
|
81 | }
|
82 |
|
83 | hoverShow () {
|
84 | if (this.data === null) {
|
85 | throw new Error('data not loaded')
|
86 | }
|
87 |
|
88 | this.cpu.hoverShow()
|
89 | this.memory.hoverShow()
|
90 | this.delay.hoverShow()
|
91 | this.handles.hoverShow()
|
92 | }
|
93 |
|
94 | hoverHide () {
|
95 | if (this.data === null) {
|
96 | throw new Error('data not loaded')
|
97 | }
|
98 |
|
99 | this.cpu.hoverHide()
|
100 | this.memory.hoverHide()
|
101 | this.delay.hoverHide()
|
102 | this.handles.hoverHide()
|
103 | }
|
104 |
|
105 | setData (data) {
|
106 | this.data = data
|
107 |
|
108 | this.cpu.setData(data.cpu, data.analysis.interval, [
|
109 | data.analysis.issues.cpu
|
110 | ])
|
111 | this.delay.setData(data.delay, data.analysis.interval, [
|
112 | data.analysis.issues.delay
|
113 | ])
|
114 | this.handles.setData(data.handles, data.analysis.interval, [
|
115 | data.analysis.issues.handles
|
116 | ])
|
117 | this.memory.setData(data.memory, data.analysis.interval, [
|
118 | data.analysis.issues.memory.rss,
|
119 | data.analysis.issues.memory.heapTotal,
|
120 | data.analysis.issues.memory.heapUsed
|
121 | ])
|
122 | }
|
123 |
|
124 | draw () {
|
125 | this.cpu.draw()
|
126 | this.memory.draw()
|
127 | this.delay.draw()
|
128 | this.handles.draw()
|
129 | }
|
130 | }
|
131 |
|
132 | module.exports = new Graph()
|