一、 图例 legend
1.1 字体相关设置
legend: {
data: ['2023上半年', '2022上半年', '名义增长率'], // 默认可以不设置
top: "24px", // 设置位置
left: "50%",
textStyle: {
color: 'red', // 默认黑色
fontSize: '18px' // 字体大小
}
},
1.2 icon样式设置
Echarts提供的标记类型包括 'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow', 'none'
legend: {
icon: 'pin'
}
可通过('image://...')设置图片
可通过('path://...')设置任意的矢量路径
二、 x轴 xAxis
2.1 是否显示&&值设置
xAxis: {
show: true, // boolean
data: ['北京','上海','深圳'] // Array
}
2.2 坐标轴刻度 xAxis.axisLabel
坐标轴刻度标签的显示间隔
设置为0时,强制显示所有标签 xAxis.axisLabel.interval = 0
刻度标签与轴线之间的距离
xAxis.axisLabel.margin = 8
xAxis: {
axisLabel: {
show: true, // 不设置默认展示
interval: 0,
margin: 8, // 不设置默认8 number
color: 'red', // 字体颜色
fontSize: '18' // 字体18px
}
}
2.3 x坐标轴轴线 xAxis.axisLine
xAxis: {
axisLine: {
show: true,
lineStyle: {
color: '#222', // x轴颜色
width: 1 // x轴线粗细
}
}
}
2.4 坐标轴刻度 xAxis.axisTick
xAxis: {
axisTick: {
show: true, // 是否显示坐标轴刻度
// 在 boundaryGap 为 true 的时候有效,可以保证刻度线和标签对齐
alignWithLabel: true
}
}