echars 遇到的问题

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、待续…

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值