option = {
backgroundColor: '#fff',
title: {
// text: `{a|分部毛利增速图}`,
textStyle: {
rich: {
a: {
fontSize: 16,
fontWeight: 600,
},
},
},
top: '2%',
left: '2%',
},
legend: {
data: ['增值服务', '金融科技及企业服务', '网络广告'],
textStyle: {
align: 'right',
},
top: '2%',
right: '2%',
},
tooltip: {
trigger: 'axis',
},
grid: {
top: '18%',
left: '8%',
right: '3%',
bottom: '10%',
},
xAxis: [
{
type: 'category',
axisLine: {
show: true,
},
splitArea: {
// show: true,
color: '#f00',
lineStyle: {
color: '#f00',
},
},
splitLine: {
show: false,
},
axisLabel: {
margin: 10,
},
boundaryGap: false,
data: [2017, 2018, 2019, 2020, 2021],
},
],
yAxis: [
{
type: 'value',
// min: 0,
// max: 140,
splitNumber: 4,
splitLine: {
show: true,
lineStyle: {
color: '#e3e3e3',
},
},
axisLine: {
show: false,
},
axisLabel: {
show: true,
margin: 20,
formatter: '{value} %',
},
axisTick: {
show: false,
},
},
],
series: [
{
name: '增值服务',
type: 'line',
smooth: true, //是否平滑
showAllSymbol: true,
symbol: 'circle',
symbolSize: 12,
lineStyle: {
normal: {
color: '#7AA1FF',
},
},
itemStyle: {
color: '#7AA1FF',
borderWidth: 3,
borderColor: '#f3f3f3',
},
data: [31.9, 10.9, 3.1, 35, 7],
},
{
name: '金融科技及企业服务',
type: 'line',
smooth: true, //是否平滑
showAllSymbol: true,
symbol: 'circle',
symbolSize: 12,
lineStyle: {
normal: {
color: '#00ca95',
},
},
itemStyle: {
color: '#00ca95',
borderColor: '#fff',
borderWidth: 3,
},
data: [0, 0, 48.5, 31.7, 41.8],
},
{
name: '网络广告',
type: 'line',
smooth: true, //是否平滑
showAllSymbol: true,
symbol: 'circle',
symbolSize: 12,
lineStyle: {
normal: {
color: '#C258F6',
},
},
itemStyle: {
color: '#C258F6',
borderColor: '#fff',
borderWidth: 3,
},
data: [28.3, 40.1, 61.1, 26.1, -3.9],
},
],
};