echarts

option = {

        title: {

          text: '标题',

          subtext: '哈哈',

          formatter: item => {

            return item + 666

          }

        },

        legend: {

          show: true

        },

        tooltip: {

          tiigger: 'axis',

          formatter: item => {

            console.log(item)

            let data = item.data

            if(item.seriesIndex == 1) {

              data = item.data + '%'

            }

            let htmStr = `

            <div style="padding:5px 3px">

              <div style="display:flex">

                <div style="width:10px;height:10px;border-radius: 50%;margin:6px 4px 0 0;background:${item.color};"></div>

                <div>${item.name}</div><div style="margin-left:8px;">${data}</div>

              </div>

            </div>

            `

            return htmStr          

          }

        },

  xAxis: {

    type: 'category',

    data: nameList, // x轴坐标值

    axisLabel: {

      interval: 0,

      formatter: (value) => {

        let ret = ''

        let valLength = value.length

        let maxLength = 2

        let rowN = Math.ceil(valLength / maxLength)

        if(rowN > 1) {

          for (var i = 0; i < rowN; i++) {

            var temp = ""

            var start = i * maxLength

            var end = start + maxLength

            temp = value.substring(start, end) + "\n"

            ret += temp

          }

          return ret

        } else {

          return value

        }

      }

    }

  },

  yAxis: [

    {

      type: 'value',

    name: '单位(1万元)',

    position:'left',

    nameTextStyle: {

      color: 'red',

      nameLocation: 'start'

    }

    },

    {

      type: 'value',

      name: '百分比',

    position:'right',

      min: 0,

      axisLabel: {

        formatter: '{value}%'

      }

    }

  ],

  series: [

    {

      data: wcList, // 数量展示值

      type: 'bar',

      itemStyle: {

        normal: {

          // 分别设置 左上角

          barBorderRadius: [10, 10, 0, 0]

        }

      }

    },

    {

      type: 'line',

      data: wccList,  // 百分比展示值

      yAxisIndex: 1,

      itemStyle: {

        normal: {

          color: 'red'

        }

      }

    }

  ]

};

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值