146 lines
2.8 KiB
JavaScript
146 lines
2.8 KiB
JavaScript
import "echarts/extension/bmap/bmap"
|
|
|
|
|
|
export default function drpOption (obj) {
|
|
const data = obj.list;
|
|
const monthsData = obj.chart
|
|
console.log(data,monthsData);
|
|
const maxQ = Math.ceil(Math.max(...data.map(obj => {
|
|
return obj?.q ? obj?.q:0
|
|
})))
|
|
const minQ = Math.floor(Math.min(...data.map(obj => {
|
|
return obj?.q? obj?.q :300
|
|
})))
|
|
const monthsX = Object.keys(monthsData);
|
|
const res = monthsX.map(item => {
|
|
const result = data?.map(s => {
|
|
const momth = s.tm.substr("2024-0".length, "2024-0".length - 5);
|
|
if (momth == String(item)) {
|
|
return [s.tm,monthsData[item]]
|
|
} else {
|
|
return []
|
|
}
|
|
})
|
|
return result
|
|
})
|
|
const data1 = res.map(s => s.filter(o => o.length > 0)).filter(o => o.length > 0)
|
|
const lines = data1.map((item, index, c) => ({
|
|
type: 'line',
|
|
markLine: {
|
|
symbol:"none",
|
|
lineStyle: {
|
|
type: "dotted",
|
|
color: "#47daff",
|
|
width: 3
|
|
},
|
|
label: {
|
|
show: true,
|
|
position:"middle",
|
|
color: "#47daff",
|
|
distance: 5,
|
|
format: "stMonth"
|
|
},
|
|
data: [
|
|
[{ coord: [item[0][0], item[0][1]] },{coord:[item[item.length - 1][0],item[item.length - 1][1]]}]
|
|
]
|
|
}
|
|
}))
|
|
|
|
let eopts = {
|
|
tooltip: {
|
|
trigger: 'axis'
|
|
},
|
|
grid: [
|
|
{
|
|
top: '10%',
|
|
left: '11%',
|
|
right: '5%',
|
|
bottom:"12%"
|
|
// width: '80%',
|
|
// height: '35%'
|
|
},
|
|
],
|
|
legend: {
|
|
// 显示图例
|
|
show: true,
|
|
top: '-1%',
|
|
},
|
|
|
|
xAxis: [
|
|
{
|
|
type: 'category',
|
|
data: data.map(o => o.tm),
|
|
inverse: true,
|
|
splitLine: {
|
|
show: false
|
|
},
|
|
axisLabel: {
|
|
color: '#333',
|
|
fontSize: 12,
|
|
format:"stList"
|
|
},
|
|
axisLine: {
|
|
lineStyle: {
|
|
color: '#000',
|
|
width: 0.5
|
|
}
|
|
},
|
|
axisTick: {
|
|
show: false
|
|
}
|
|
}
|
|
],
|
|
yAxis: [
|
|
{
|
|
type: 'value',
|
|
// gridIndex:0,
|
|
position: 'left',
|
|
name: '生态流量(m³/s)',
|
|
splitLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: '#000',
|
|
width: 0.25,
|
|
type: 'dotted'
|
|
}
|
|
},
|
|
axisLabel: {
|
|
color: '#333',
|
|
fontSize: 12
|
|
},
|
|
axisLine: {
|
|
show: false
|
|
},
|
|
axisTick: {
|
|
show: false
|
|
},
|
|
min: minQ,
|
|
max: maxQ
|
|
},
|
|
],
|
|
}
|
|
let chartData = {
|
|
series: [
|
|
{
|
|
name: '生态流量(m³/s)',
|
|
type: 'line',
|
|
symbol: 'none',
|
|
color: '#4fa2ea',
|
|
smooth:true,
|
|
label: {
|
|
show: false
|
|
},
|
|
data: data.map(o => o.q)
|
|
},
|
|
...lines
|
|
]
|
|
}
|
|
return {
|
|
eopts,
|
|
chartData
|
|
}
|
|
}
|
|
|
|
|
|
|