echarts折线图的symbol自定义样式

series: [
        {
          name: '失败任务数',
          type: 'bar',
          yAxisIndex: 0,
          data: failTask,
          showBackground: true, //显示柱条的背景色
          backgroundStyle: {
            color: 'rgba(199, 199, 199, 0.1)',
          },
          itemStyle: {
            color: {
              type: 'linear',
              x: 0,
              y: 0,
              x2: 0,
              y2: 1,
              colorStops: [
                {
                  offset: 0,
                  color: 'rgba(0,58,255,0)', // 0% 处的颜色
                },
                {
                  offset: 1,
                  color: '#23BA65', // 100% 处的颜色
                },
              ],
              global: false, // 缺省为 false
            },
          },
          barWidth: 16,
        },
        {
          name: '失败记录数',
          yAxisIndex: 1,
          type: 'line',
          symbol:`image://${lineCircle}`,
          symbolSize:20,
          data: logRecords,
          itemStyle: {
            color: 'rgba(255, 87, 4, 1)',
          },
        },
      ],

import lineCircle from ‘@/assets/newImgs/line-circle.svg’;
引入svg图片
路径写法必须为:symbol:image://${lineCircle}

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值