/** Copyright 2020 Tianshu AI Platform. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* =============================================================
*/
import { round } from 'lodash';
// 公共默认配置
export const defaultOption = {
// x轴
xAxis: {
type: 'category',
boundaryGap: false,
},
// y轴
yAxis: {
splitLine: {
show: false,
},
min(value) {
// 如果图中没有值,y轴最小值默认设为 0
if (value.min === Infinity) {
return 0;
}
// y轴最小值不小于 0; y轴最小值与数据最小值的距离不大于 10,且不大于数据最大值与 100 之间的距离
return round(Math.max(value.min - Math.min(100 - value.max, 10), 0), 2);
},
max(value) {
// 如果图中没有值,y轴最大值默认设为 100
if (value.max === -Infinity) {
return 100;
}
// y轴最大值不大于 100; y轴最大值与数据最大值的距离不大于 10,且不大于数据最小值与 0 之间的距离
return round(Math.min(value.max + Math.min(value.min, 10), 100), 2);
},
},
grid: {
right: '5%',
},
// 图例,涉及多节点展示
legend: {
show: true,
width: 400,
data: [],
},
series: {
type: 'line',
data: [],
},
tooltip: {
trigger: 'axis',
backgroundColor: 'rgba(245, 245, 245, 0.8)',
borderWidth: 1,
borderColor: '#ccc',
textStyle: {
color: '#000',
},
formatter(params) {
const toolTips = params.map(({ seriesName, value }) => {
return `${seriesName}: ${value === undefined ? '-' : value}`;
});
return toolTips.join('
');
},
},
toolbox: {
right: 30,
feature: {
dataZoom: {
yAxisIndex: 'none',
},
restore: {},
},
},
dataZoom: [
{
start: 0,
},
{
type: 'inside',
},
],
};
export const cpuOption = {
title: {
text: 'CPU',
},
// y轴
yAxis: {
name: 'CPU 占用率(%)',
},
};
export const memOption = {
title: {
text: '内存',
},
// y轴
yAxis: {
name: '内存使用量(Gi)',
min(value) {
if (value.min === Infinity) {
return 0;
}
// 内存 y轴最小值不小于 0; y轴最小值与数据最小值的距离不大于 1。内存理论上不设置内存上限
return round(Math.max(value.min - 1, 0), 2);
},
max(value) {
// 内存无数据时默认设置 y 轴上限为 8
if (value.max === -Infinity) {
return 8;
}
// 内存 y轴最大值与数据最大值的距离不大于 1,且不大于数据最小值与 0 之间的距离; 理论上不设置上限
return round(value.max + Math.min(1, value.min), 2);
},
},
};
export const gpuOption = {
title: {
text: 'GPU',
},
// y轴
yAxis: {
name: 'GPU 占用率(%)',
},
tooltip: {
formatter(params) {
const toolTips = params.map(({ seriesName, value }) => {
const [podName, accId] = seriesName.split(': ');
return `${podName}:
${accId}: ${value === undefined ? '-' : value}`;
});
return toolTips.join('
');
},
},
};