${headerName}

`; for (let it of params) { if (it.seriesType == 'pictorialBar') { str += `${it.seriesName}：${it.value}吨`; } else { str += `${it.seriesName}：${it.value}`; } } str += `

`; return str; }, }, grid: { right: '5%', top: '20%', left: '5%', bottom: '5%', containLabel: true, }, xAxis: { data: chartData.map((it) => { return it.name; }), axisLine: { lineStyle: { color: '#ffffff', }, }, axisLabel: { color: '#fff', fontSize: 14, }, }, yAxis: { name: '吨', nameTextStyle: { color: '#fff', fontSize: 16, }, axisLine: { lineStyle: { color: '#ffffff', }, }, axisLabel: { color: '#ffffff', fontSize: 16, }, splitLine: { show: false, lineStyle: { color: '#ffffff', }, }, }, series: [ { name: '销售量', type: 'pictorialBar', symbol: 'triangle', barWidth: 18, itemStyle: { normal: { color: { type: 'linear', x: 0, y: 0, x2: 0, y2: 1, colorStops: [ { offset: 0, color: 'rgba(48, 236, 166, 1)', // 0% 处的颜色 }, { offset: 1, color: 'rgba(0, 34, 66, 0.2)', // 100% 处的颜色 }, ], globalCoord: false, // 缺省为 false }, //渐变颜色 }, }, data: chartData.map((it) => { return { name: it.name, value: it.count }; }), }, { name: '销售价', type: 'line', symbolSize: 10, symbol: 'circle', smooth: true, showSymbol: false, lineStyle: { normal: { width: 2, color: 'rgba(143,0,254,1)', }, }, itemStyle: { normal: { color: 'rgba(143,0,254,1)', borderWidth: 0, borderColor: '#A9F387', }, }, smooth: true, data: chartData.map((it) => { return { name: it.name, value: it.price }; }), }, ], };

Echarts在线免费图表