- public latencyChartColors: Array<any> = [
- { // blue
- backgroundColor: 'rgba(197, 239, 247, 0.2)',
- borderColor: 'lightblue',
- pointBackgroundColor: 'lightblue',
- pointBorderColor: '#fff',
- pointHoverBackgroundColor: '#fff',
- pointHoverBorderColor: 'rgba(148,159,177,0.8)'
- }
- ];
- public latencyChartOptions = {
- scaleShowVerticalLines: true,
- responsive: true,
- animation: {
- duration: 800 * 1.5,
- easing: 'linear'
- },
- hover: {
- animationDuration: 1 // duration of animations when hovering an item
- },
- responsiveAnimationDuration: 500,
- scales: {
- yAxes: [{
- ticks: {
- // the data minimum used for determining the ticks is Math.min(dataMin, suggestedMin)
- suggestedMin: 0,
- // the data maximum used for determining the ticks is Math.max(dataMax, suggestedMax)
-// suggestedMax: 1000
- },
- scaleLabel: {
- display: true,
- labelString: 'msecs'
- }
- }],
- xAxes: [{
- scaleLabel: {
- display: true,
- labelString: 'time (last 10 seconds)'
- }
- }]
- },
- };
- public latencyChartLabels = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10'];
- public latencyChartType = 'line';
- public latencyChartLegend = true;
- public latencyChartData = [
- { data: [65, 59, 80, 81, 56, 55, 40, 20, 12, 34], label: 'Latency' },
- ];
-
- public loadChartColors: Array<any> = [
-
- { // green
- backgroundColor: 'rgba(200, 247, 197, 0.2)',
- borderColor: 'lightgreen',
- pointBackgroundColor: 'lightgreen',
- pointBorderColor: '#fff',
- pointHoverBackgroundColor: '#fff',
- pointHoverBorderColor: 'rgba(0,200,0,0.5)'
- }
- ];
- public loadChartOptions = {
- scaleShowVerticalLines: false,
- responsive: true,
- animation: {
- duration: 800 * 1.5,
- easing: 'linear'
- },
- hover: {
- animationDuration: 1 // duration of animations when hovering an item
- },
- responsiveAnimationDuration: 500,
- scales: {
- yAxes: [{
- ticks: {
- // the data minimum used for determining the ticks is Math.min(dataMin, suggestedMin)
- suggestedMin: 0,
- // the data maximum used for determining the ticks is Math.max(dataMax, suggestedMax)
-// suggestedMax: 1000
- },
- scaleLabel: {
- display: true,
- labelString: '# of requests'
- }
- }],
- xAxes: [{
- scaleLabel: {
- display: true,
- labelString: 'time (last 10 seconds)'
- }
- }]
- },
- };
- public loadChartLabels = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10'];
- public loadChartType = 'line';
- public loadChartLegend = true;
- public loadChartData = [
- { data: [28, 48, 40, 19, 86, 77, 90, 20, 12, 34], label: 'Load' }
- ];
-
- public cpuChartColors: Array<any> = [
-
- { // red
- backgroundColor: 'rgba(241, 169, 160, 0.2)',
- borderColor: 'brown',
- pointBackgroundColor: 'brown',
- pointBorderColor: '#fff',
- pointHoverBackgroundColor: '#fff',
- pointHoverBorderColor: 'rgba(0,200,0,0.5)'
- }
- ];
- public cpuChartOptions = {
- scaleShowVerticalLines: false,
- responsive: true,
- animation: {
- duration: 800 * 1.5,
- easing: 'linear'
- },
- hover: {
- animationDuration: 1 // duration of animations when hovering an item
- },
- responsiveAnimationDuration: 500,
- scales: {
- yAxes: [{
- ticks: {
- // the data minimum used for determining the ticks is Math.min(dataMin, suggestedMin)
- suggestedMin: 0,
- // the data maximum used for determining the ticks is Math.max(dataMax, suggestedMax)
-// suggestedMax: 1000
- },
- scaleLabel: {
- display: true,
- labelString: '# of requests'
- }
- }],
- xAxes: [{
- scaleLabel: {
- display: true,
- labelString: 'time (last 10 seconds)'
- }
- }]
- },
- };
- public cpuChartLabels = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10'];
- public cpuChartType = 'line';
- public cpuChartLegend = true;
- public cpuChartData = [
- { data: [15, 29, 30, 31, 53, 52, 41, 70, 32, 14], label: 'RICLoad' }
- ];
-
- public x = 11;
-
- public y = 11;
-
- public z = 11;
- public loop = true;
-
- latencyClickData() {
- // this.latencyChartData = [{data: [Math.random() * 100, Math.random() * 100, Math.random() * 100,
- // Math.random() * 100, Math.random() * 100, Math.random() * 100, Math.random() * 100, Math.random() * 100,
- // Math.random() * 100, Math.random() * 100], label: 'Latency'}];
- this.charts.forEach((child) => {
- if (child.datasets[0].label === 'Latency') {
- this.latencyChartLabels.shift();
- child.datasets[0].data.shift();
-
- const latencyData = this.service.getLatencyMetrics();
- child.datasets[0].data.push(latencyData);
- this.latencyChartLabels.push('' + this.x++);
- }
- // once new data is computed and datasets are updated, tell our baseChart the datasets changed
- child.ngOnChanges({
- datasets: {
- currentValue: child.datasets,
- previousValue: null,
- firstChange: true,
- isFirstChange: () => true
- }
- });
- });
- }
-
- loadClickData() {
- if (this.loop) {
- this.loop = false;
- this.startLoadTimer();
- } else {
- this.loop = true;
- this.pauseLoadTimer();
- }
- }
-
- loopLoadData(metricsv: any) {
- this.charts.forEach((child) => {
- if (child.datasets[0].label === 'Load') {
- this.loadChartLabels.shift();
- child.datasets[0].data.shift();
-
- //const loadData = this.service.getLoad();
- //child.datasets[0].data.push(this.service.load);
- child.datasets[0].data.push(metricsv['load']);
- this.loadChartLabels.push('' + this.x++);
- }
- if (child.datasets[0].label === 'Latency') {
- this.latencyChartLabels.shift();
- child.datasets[0].data.shift();
-
- //const loadData = this.service.getLoad();
- //child.datasets[0].data.push(this.service.load);
- child.datasets[0].data.push(metricsv['latency']);
- this.latencyChartLabels.push('' + this.x++);
- }
- if (child.datasets[0].label === 'RICLoad') {
- this.latencyChartLabels.shift();
- child.datasets[0].data.shift();
-
- //const loadData = this.service.getLoad();
- //child.datasets[0].data.push(this.service.load);
- child.datasets[0].data.push(metricsv['ricload']);
- this.latencyChartLabels.push('' + this.x++);
- }
- // once new data is computed and datasets are updated, tell our baseChart the datasets changed
- child.ngOnChanges({
- datasets: {
- currentValue: child.datasets,
- previousValue: null,
- firstChange: true,
- isFirstChange: () => true
- }
- });
- });
- }
-
- cpuClickData() {
- // this.cpuChartData = [{data: [Math.random() * 100, Math.random() * 100, Math.random() * 100,
- // Math.random() * 100, Math.random() * 100, Math.random() * 100, Math.random() * 100, Math.random() * 100,
- // Math.random() * 100, Math.random() * 100], label: 'CPU'}];
- const cpuData = this.service.getLatencyMetrics();
- this.newDataPoint([cpuData], this.z++);