实现图例效果
获取最大值方法:
maxSecond(array) {
let max = Number.MIN_SAFE_INTEGER;
for (let i = 0; i < array.length; i++) {
const secondElement = parseInt(array[i][1]);
if (secondElement > max) {
max = secondElement;
}
}
return max;
},
获取最大值索引:
maxSecondIndex(array) {
let max = Number.MIN_SAFE_INTEGER;
let maxIndex = -1;
for (let i = 0; i < array.length; i++) {
const secondElement = parseInt(array[i][1]);
if (secondElement > max) {
max = secondElement;
maxIndex = i;
}
}
return maxIndex;
},
获取最小值方法:
minSecond(array) {
let min = Number.MAX_SAFE_INTEGER;
for (let i = 0; i < array.length; i++) {
const secondElement = parseInt(array[i][1]);
if (secondElement < min) {
min = secondElement;
}
}
return min;
},
获取最小值索引:
minSecondIndex(array) {
let min = Number.MAX_SAFE_INTEGER;
let minIndex = -1;
for (let i = 0; i < array.length; i++) {
const secondElement = parseInt(array[i][1]);
if (secondElement < min) {
min = secondElement;
minIndex = i;
}
}
return minIndex;
},
// 按类型柱状图1
setLine1(data) {
var newData = []
data.forEach(thisData => {
var td =[]
td.push(thisData.recordDate)
td.push(thisData.totalCount)
newData.push(td)
})
const max = this.maxSecond(newData)
const maxIndex = this.maxSecondIndex(newData)
const min = this.minSecond(newData)
const minIndex = this.minSecondIndex(newData)
var option3;
option3 = {
title: {
text: '操作票数量'
},
tooltip: {
trigger: 'axis'
},
legend: {
data: ['数量']
},
calculable: true,
xAxis: {
type: 'category',
boundaryGap: false,
},
yAxis: {
type: 'value'
},
series: [
{
name: '操作票',
data: newData,
markPoint: {
data: [
{ name: 'Max', value: max, xAxis: maxIndex, yAxis: max },
{ name: 'Min', value: min, xAxis: minIndex, yAxis: min }
],
label: {
show: true,
color: '#fff', // 修改字体颜色为红色
fontSize:17
}
},
type: 'bar',
symbol: 'none', //取消折点圆圈
smooth: true, //折线平滑
itemStyle: {
color: new echarts.graphic.LinearGradient(
0, 0, 0, 1,
[
{offset: 0, color: '#0cbd9a'}, // 渐变起始处的颜色:淡蓝色
{offset: 1, color: '#29bf71'} // 渐变结束处的颜色:浅蓝色
]
)
},
// 提示框展示配置
tooltip: {
// 提示框展示的内容
valueFormatter: function (value) {
return value + "张";
},
},
}
]
};
if (this.dataEchart == null || this.dataEchart == '' || this.dataEchart == undefined) {
this.dataEchart = echarts.init(this.$refs.dataEchart1, 'macarons')
}
this.dataEchart.clear()
this.dataEchart.setOption(option3,true)
},
根据代码自己将值替换即可实现上面图的效果