1、echarts 折线图圆点背景色修改
series: [{
type: 'line',
symbol: "circle", // 实心圆
smooth: true, //是否平滑曲线显示
showSymbol: false,// 圆点默认隐藏,鼠标滑过显示
areaStyle: { //区域填充样式
normal: {
//线性渐变,前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’,则该四个值是绝对像素位置。
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0.9, color: 'rgba(121, 72, 234, 1)'},
{ offset: 0.9, color: 'rgba(121, 72, 234, 1)'}
], false),
shadowColor: 'rgba(121, 72, 255, 1)', //阴影颜色
shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
}
},
itemStyle: {
normal: {
color: "rgba(121, 72, 255, 1)", //实心圆颜色
borderColor:'#fff',// 边框颜色
lineStyle: {
color: "rgba(121, 72, 255, 1)" // 折线颜色
}
}
},
data: [340, 290, 560, 250, 780, 460,580,440,130,680,620,300,640,439,840]
}]
2、showSymbol: false,//折线图, 圆点默认隐藏,鼠标滑过显示。折线是否平滑曲线显示smooth: true,
3、隐藏 x轴,y轴,的数值名称。
xAxis: {
"show" : false,// 隐藏下面显示的
},
yAxis: {
"show" : false,// 隐藏下面显示的
},
4、给柱状图添加阴影柱
tooltip: {
trigger: 'axis', // 设置这个会有一条线
axisPointer: {
type: 'shadow' // 设置这个改变线的样式
}
},
5、可以让x轴 7月1号 在刻度线上
xAxis: {
min: 0, max: 7,
axisLabel:{interval:0},// 间隔
type : 'category',
data: ["7月1号","7月2号","7月3号","7月4号","7月5号","7月6号",'7月7号'],
axisTick: {
alignWithLabel: true // 可以让7月1号 在刻度线上
},
},
6、echarts 图表拖动条 鼠标滚轮控制
dataZoom:[
{
show: true,
start: 0,
end: 100,
},
{
type: 'inside',
start: 94,
end: 100,
},
],
7、待续…