echarts分段折线图中visualMap的pieces怎么设置负数的颜色?

我现在用的echarts官网的 分段折线图
设计图是这种,这种有人做过吗,或者有没有其它插件可以实现呀?
s.png
wfv.png

 visualMap: {
          show: false,
          top: 50,
          right: 10,
          type: 'piecewise',
          textStyle: { color: '#ADD6FF' },
          // pieces: [], //pieces的值由动态数据决定
          pieces: [
            {
              gt: 50,
              lte: 100,
              color: '#FBDB0F',
            },
            {
              gt: 100,
              lte: 150,
              color: '#FC7D02',
            },
            {
              gt: 150,
              lte: 200,
              color: '#FD0100',
            },
            {
              gt: 200,
              lte: 300,
              color: '#AA069F',
            },
            {
              gt: 300,
              color: '#AC3B2A',
            },
          ],
          outOfRange: {
            color: '#ADD6FF',
          },
        },
阅读 3.7k
1 个回答

series的lineData里没法只显示两个箭头,去除y轴横线以后。
用series里lineData的箭头表示y轴分出的区域

pieces: [
              {
                gt: -220,
                lte: -200,
                color: '#FD0100',
              },
              {
                gt: -200,
                lte: -160,
                color: '#FBDB0F',
              },
              {
                gt: -160,
                lte: -60,
                color: '#93CE07',
              },
              {
                gt: -60,
                lte: 0,
                color: '#A3FE77',
              },
              {
                gt: 0,
                lte: 60,
                color: '#FC7D02',
              },
              {
                gt: 60,
                lte: 160,
                color: '#93CE07',
              },
              {
                gt: 160,
                lte: 200,
                color: '#FBDB0F',
              },
              {
                gt: 200,
                color: '#FD0100',
              },
            ],

// series里
lineData: [
            {
              yAxis: -220,
            },
            {
              yAxis: -200,
            },
            {
              yAxis: -160,
            },
            {
              yAxis: -60,
            },
            {
              yAxis: 60,
            },
            {
              yAxis: 160,
            },
            {
              yAxis: 200,
            },
            {
              yAxis: 220,
            },
          ],
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题