fix:修改legend 跟图例不对应的问题
This commit is contained in:
@@ -283,14 +283,7 @@ export default {
|
|||||||
screenLegendList:[], */
|
screenLegendList:[], */
|
||||||
isGrey: [],
|
isGrey: [],
|
||||||
isGreyScreen: [],
|
isGreyScreen: [],
|
||||||
/* bgColorList: ['#7bbfea', '#b3424a', '#f05b72', '#596032', '#bd6758',
|
bgColorList: [],
|
||||||
'#cd9a5b', '#918597', '#70a19f', '#005344', '#FF00FF',
|
|
||||||
'#f7acbc', '#5f5d46', '#66ffff', '#ccFF66', '#f47920',
|
|
||||||
'#769149', '#1d953f', '#abc88b', '#7f7522', '#9b95c9',
|
|
||||||
'#f3715c', '#ea66a6', '#d1c7b7', '#9d9087', '#77787b',
|
|
||||||
'#f58220', '#c37e00', '#00ae9d', '#f26522', '#76becc',
|
|
||||||
'#76624c', '#d71345', '#2468a2', '#ca8687', '#1b315e',
|
|
||||||
], */
|
|
||||||
stackTotalColor: null,
|
stackTotalColor: null,
|
||||||
firstShow: false, // 默认不显示操作按钮,
|
firstShow: false, // 默认不显示操作按钮,
|
||||||
caretShow: false,
|
caretShow: false,
|
||||||
@@ -1593,13 +1586,14 @@ export default {
|
|||||||
}
|
}
|
||||||
if (pos >= this.data.elements.length) {
|
if (pos >= this.data.elements.length) {
|
||||||
legend.push({ name: 'process_' + host + '-' + elements.id + '-' + innerPos, alias: 'process_' + alias })
|
legend.push({ name: 'process_' + host + '-' + elements.id + '-' + innerPos, alias: 'process_' + alias })
|
||||||
|
seriesItem.theData.name = 'process_' + host + '-' + elements.id + '-' + innerPos
|
||||||
|
seriesItem.metric_name = seriesItem.theData.name
|
||||||
} else {
|
} else {
|
||||||
legend.push({ name: host + '-' + elements.id + '-' + innerPos, alias: alias })
|
legend.push({ name: host + '-' + elements.id + '-' + innerPos, alias: alias })
|
||||||
|
seriesItem.theData.name = host + '-' + elements.id + '-' + innerPos
|
||||||
|
seriesItem.metric_name = seriesItem.theData.name
|
||||||
}
|
}
|
||||||
// 图表中每条线的名字,去掉最后的逗号与空格:metric名称, 标签1=a,标签2=c
|
// 图表中每条线的名字,去掉最后的逗号与空格:metric名称, 标签1=a,标签2=c
|
||||||
|
|
||||||
seriesItem.theData.name = host + '-' + elements.id + '-' + innerPos
|
|
||||||
seriesItem.metric_name = seriesItem.theData.name
|
|
||||||
// 将秒改为毫秒
|
// 将秒改为毫秒
|
||||||
// alert('table=='+JSON.stringify(queryItem))
|
// alert('table=='+JSON.stringify(queryItem))
|
||||||
seriesItem.theData.data = queryItem.values.map((dpsItem, dpsIndex) => {
|
seriesItem.theData.data = queryItem.values.map((dpsItem, dpsIndex) => {
|
||||||
@@ -1632,6 +1626,9 @@ export default {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
this.setColor(legend.length)
|
this.setColor(legend.length)
|
||||||
|
legend.forEach((item, index) => {
|
||||||
|
item.color = this.bgColorList[index]
|
||||||
|
})
|
||||||
if (this.$refs.pickTime.$refs.multipleTime && this.$refs.pickTime.$refs.multipleTime.searchTime.length && res.length > this.data.elements.length) {
|
if (this.$refs.pickTime.$refs.multipleTime && this.$refs.pickTime.$refs.multipleTime.searchTime.length && res.length > this.data.elements.length) {
|
||||||
const minusTime = (new Date(this.searchTime[0]).getTime() - new Date(this.$refs.pickTime.$refs.multipleTime.searchTime[0]).getTime())
|
const minusTime = (new Date(this.searchTime[0]).getTime() - new Date(this.$refs.pickTime.$refs.multipleTime.searchTime[0]).getTime())
|
||||||
let cutPoint = 0
|
let cutPoint = 0
|
||||||
|
|||||||
@@ -502,6 +502,7 @@ export default {
|
|||||||
}
|
}
|
||||||
if (promIndex >= this.selectedEndpoints.length) {
|
if (promIndex >= this.selectedEndpoints.length) {
|
||||||
legend.name = 'process_' + legend.name
|
legend.name = 'process_' + legend.name
|
||||||
|
chartData.name = legend.name
|
||||||
legend.alias = 'process_' + legend.alias
|
legend.alias = 'process_' + legend.alias
|
||||||
}
|
}
|
||||||
this.legend.push(legend)
|
this.legend.push(legend)
|
||||||
|
|||||||
@@ -58,11 +58,11 @@
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
.tongbi-box{
|
.compare-box{
|
||||||
line-height: 50px;
|
line-height: 50px;
|
||||||
margin-right: 20px;
|
margin-right: 20px;
|
||||||
}
|
}
|
||||||
.nz-icon-tongbi{
|
.nz-icon-compare{
|
||||||
background: #FFFFFF;
|
background: #FFFFFF;
|
||||||
border: 1px solid #DEDEDE;
|
border: 1px solid #DEDEDE;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
@@ -107,7 +107,7 @@
|
|||||||
</style>
|
</style>
|
||||||
<template>
|
<template>
|
||||||
<div class="multiple-time-box">
|
<div class="multiple-time-box">
|
||||||
<div :class="showDropdown?'tongbi-box':''"><i class="nz-icon nz-icon-tongbi" @click="changeShowDropdown" /></div>
|
<div :class="showDropdown?'compare-box':''"><i class="nz-icon nz-icon-compare" @click="changeShowDropdown" /></div>
|
||||||
<transition name="multiple-time-datepicker">
|
<transition name="multiple-time-datepicker">
|
||||||
<div class="calendar top-tools" id="panel-calender" v-show="showDropdown">
|
<div class="calendar top-tools" id="panel-calender" v-show="showDropdown">
|
||||||
<el-date-picker prefix-icon=" " size="mini" ref="calendar"
|
<el-date-picker prefix-icon=" " size="mini" ref="calendar"
|
||||||
@@ -433,6 +433,16 @@ export default {
|
|||||||
text: this.$t('dashboard.panel.noDate')
|
text: this.$t('dashboard.panel.noDate')
|
||||||
}
|
}
|
||||||
this.$emit('change', this.searchTime)
|
this.$emit('change', this.searchTime)
|
||||||
|
} else {
|
||||||
|
this.searchTime = []
|
||||||
|
this.showTime = this.nowTimeType = {
|
||||||
|
id: 4,
|
||||||
|
text: this.$t('dashboard.panel.beforeOneHour'),
|
||||||
|
type: 'hour',
|
||||||
|
value: 1
|
||||||
|
}
|
||||||
|
this.setSearchTime(this.showTime.type, this.showTime.value)
|
||||||
|
this.$emit('change', this.searchTime)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user