vue echarts中按钮点击后修改值 watch数据变化后刷新图表

8 篇文章 0 订阅

1 点击按钮

{
        feature: {
          myBtn1: {
            show: true,
            title: '反转Y轴',
            showTitle: true,

            icon: 'path://M512 0A512 512 0 1 0 512 1024A512 512 0 0 0 512 0M320 320V192h384v128zM128 416V288h256v128zM320 704V576h384v128zM128 800V672h256v128z',
            onclick: () => {
              dataSetting.reverse_y = !dataSetting.reverse_y// 您需要修改一下 onclick 的回调函数,将它的上下文绑定到 Vue 实例上,否则 this 指的是 myBtn1 这个按钮对象,导致无法修改 showSetting 的值。
            },
          },

        },
        right: 120,
        bottom: '5%',

      },

2 设置值

 yAxis: [

      {
        scale: true, // 这句是 优化y轴最小刻度
        inverse: dataSetting.reverse_y, // 反转 Y 轴
        axisLine: { show: true },
        splitArea: {
          show: true  // y轴 区域渐变色
        }
      },

3 监控变量 dataSetting.reverse_y 是否变动, 变动后 刷新图

 watch: {
    'dataSetting.reverse_y'(newVal, oldVal) {
      this.getCharts(this.klineData, this.SingleChartObj.cycle)
    },

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值