myChart.setOption({
title: {
text: '2024年全国降雨量统计',
show: false
},
legend: {
show: true
},
toolbox: {
show: true,
feature: {
magicType: { show: true, type: ['stack', 'tiled'] },
saveAsImage: { show: true }
}
},
tooltip: {},
xAxis: {
name: '降雨量/ML',
data: [
{
value: '0-100',
textStyle: {fontSize: 20,color: 'red'}}, {value: '100-500',textStyle: {fontSize: 20,color: 'red'}}, {value: '500-1000',textStyle: {fontSize: 20,color: 'red'}}, {value: '1000-2000',}, {value: '2000-5000',}, {value: '5000以上',}]},yAxis: {name: '天数'},series: [{name: '降雨量',type: 'line',label: {show: true,position: 'top',formatter: (params) => {return params.value + '天'}},itemStyle: {color: 'rgba(255, 152, 0, .7)'},smooth: true,tooltip: {formatter: (params) => {return '2024年' + params.seriesName + '<br />' + params.name + '总天数为' + '<br/>' + params.value + '天'},textStyle: {color: 'blue',textShadowColor: 'green',textShadowBlur: 2,textShadowOffsetX: 1,textShadowOffsetY: 1,},extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);'},symbol: 'image://src/assets/vue.svg',symbolSize: 20,symbolRotate: (value, params) => {const seriesData = myChart.getOption().series[0].data;const dataLength = seriesData.length;switch (params.dataIndex) {case 0: return (seriesData[params.dataIndex + 1] - seriesData[params.dataIndex]) * 25;case 1: return (seriesData[params.dataIndex + 1] - seriesData[params.dataIndex]) * 25;case 2: return (seriesData[params.dataIndex + 1] - seriesData[params.dataIndex]) * 25;case 3: return (seriesData[params.dataIndex + 1] - seriesData[params.dataIndex]) * 25;case 4: return (seriesData[params.dataIndex + 1] - seriesData[params.dataIndex]) * 25;case 5: return 0;}},stack: 'value',symbolKeepAspect: true,data: [Math.floor(Math.random() * 30), Math.floor(Math.random() * 30), Math.floor(Math.random() * 30), Math.floor(Math.random() * 30), Math.floor(Math.random() * 30), Math.floor(Math.random() * 30)]},],})
