perf: overview柱状图美化

This commit is contained in:
chenjinsong
2020-07-09 21:14:05 +08:00
parent ea8dca30ae
commit 05a57f1f30
2 changed files with 8 additions and 14 deletions

View File

@@ -193,7 +193,6 @@
top: 30, top: 30,
left: 0, left: 0,
right: 30, right: 30,
containLabel: true,
bottom:8 bottom:8
}, },
series: [], series: [],
@@ -221,14 +220,15 @@
}, },
data: [], data: [],
axisLabel: { axisLabel: {
show:true, show: true,
formatter: function(value) { formatter: function(value) {
if (value.length > 12) { if (value.length > 33) {
return value.substring(0, 9) + "..."; return value.substring(0, 30) + "...";
} }
return value; return value;
}, },
fontSize: 10 align: 'left',
margin: 200,
}, },
triggerEvent: true triggerEvent: true
}, },

View File

@@ -815,8 +815,6 @@
let seriesData = []; let seriesData = [];
let categoryData = []; let categoryData = [];
response.data.list.forEach(item => { response.data.list.forEach(item => {
//seriesData.push(item.nums);
//categoryData.push(item.alertName);
seriesData.splice(0, 0, item.nums); seriesData.splice(0, 0, item.nums);
categoryData.splice(0, 0, item.alertName); categoryData.splice(0, 0, item.alertName);
}); });
@@ -831,7 +829,7 @@
this.$refs.ruleMessage.modifyOption("tooltip", "backgroundColor", "rgba(221,228,237,1)"); this.$refs.ruleMessage.modifyOption("tooltip", "backgroundColor", "rgba(221,228,237,1)");
this.$refs.ruleMessage.modifyOption("tooltip", "textStyle", {color: "#000"}); this.$refs.ruleMessage.modifyOption("tooltip", "textStyle", {color: "#000"});
this.$refs.ruleMessage.modifyOption("grid", "top", 30); this.$refs.ruleMessage.modifyOption("grid", "top", 30);
this.$refs.ruleMessage.modifyOption("grid", "left", 0); this.$refs.ruleMessage.modifyOption("grid", "left", 200);
this.$refs.ruleMessage.modifyOption("grid", "right", 30); this.$refs.ruleMessage.modifyOption("grid", "right", 30);
this.$refs.ruleMessage.modifyOption("grid", "bottom", 8); this.$refs.ruleMessage.modifyOption("grid", "bottom", 8);
this.$refs.ruleMessage.setSeries(this.messageByRuleSeries); this.$refs.ruleMessage.setSeries(this.messageByRuleSeries);
@@ -846,8 +844,6 @@
let seriesData = []; let seriesData = [];
let categoryData = []; let categoryData = [];
response.data.list.forEach(item => { response.data.list.forEach(item => {
/*seriesData.push(item.nums);
categoryData.push(item.host);*/
seriesData.splice(0, 0, item.nums); seriesData.splice(0, 0, item.nums);
categoryData.splice(0, 0, item.host); categoryData.splice(0, 0, item.host);
}); });
@@ -862,7 +858,7 @@
this.$refs.assetMessage.modifyOption("tooltip", "backgroundColor", "rgba(221,228,237,1)"); this.$refs.assetMessage.modifyOption("tooltip", "backgroundColor", "rgba(221,228,237,1)");
this.$refs.assetMessage.modifyOption("tooltip", "textStyle", {color: "#000"}); this.$refs.assetMessage.modifyOption("tooltip", "textStyle", {color: "#000"});
this.$refs.assetMessage.modifyOption("grid", "top", 30); this.$refs.assetMessage.modifyOption("grid", "top", 30);
this.$refs.assetMessage.modifyOption("grid", "left", 0); this.$refs.assetMessage.modifyOption("grid", "left", 200);
this.$refs.assetMessage.modifyOption("grid", "right", 30); this.$refs.assetMessage.modifyOption("grid", "right", 30);
this.$refs.assetMessage.modifyOption("grid", "bottom", 8); this.$refs.assetMessage.modifyOption("grid", "bottom", 8);
this.$refs.assetMessage.setSeries(this.messageByAssetSeries); this.$refs.assetMessage.setSeries(this.messageByAssetSeries);
@@ -877,8 +873,6 @@
let seriesData = []; let seriesData = [];
let categoryData = []; let categoryData = [];
response.data.list.forEach(item => { response.data.list.forEach(item => {
/*seriesData.push(item.nums);
categoryData.push(item.module);*/
seriesData.splice(0, 0, item.nums); seriesData.splice(0, 0, item.nums);
categoryData.splice(0, 0, item.module); categoryData.splice(0, 0, item.module);
}); });
@@ -893,7 +887,7 @@
this.$refs.moduleMessage.modifyOption("tooltip", "backgroundColor", "rgba(221,228,237,1)"); this.$refs.moduleMessage.modifyOption("tooltip", "backgroundColor", "rgba(221,228,237,1)");
this.$refs.moduleMessage.modifyOption("tooltip", "textStyle", {color: "#000"}); this.$refs.moduleMessage.modifyOption("tooltip", "textStyle", {color: "#000"});
this.$refs.moduleMessage.modifyOption("grid", "top", 30); this.$refs.moduleMessage.modifyOption("grid", "top", 30);
this.$refs.moduleMessage.modifyOption("grid", "left", 0); this.$refs.moduleMessage.modifyOption("grid", "left", 200);
this.$refs.moduleMessage.modifyOption("grid", "right", 30); this.$refs.moduleMessage.modifyOption("grid", "right", 30);
this.$refs.moduleMessage.modifyOption("grid", "bottom", 8); this.$refs.moduleMessage.modifyOption("grid", "bottom", 8);
this.$refs.moduleMessage.setSeries(this.messageByModuleSeries); this.$refs.moduleMessage.setSeries(this.messageByModuleSeries);