在Echarts中,可以通过legend属性来设置图例的样式和颜色。如果要设置图例颜色与柱子不同,可以使用legend.textStyle.color来设置图例文字的颜色,使用legend.itemStyle.color来设置图例图标的颜色。

以下是一个示例代码,展示如何设置两个图例颜色不同:

option = {
  legend: [
    {
      data: ['图例1'],
      textStyle: {
        color: 'red' // 设置图例1的文字颜色
      },
      itemStyle: {
        color: 'red' // 设置图例1的图标颜色
      }
    },
    {
      data: ['图例2'],
      textStyle: {
        color: 'blue' // 设置图例2的文字颜色
      },
      itemStyle: {
        color: 'blue' // 设置图例2的图标颜色
      }
    }
  ],
  series: [
    {
      name: '图例1',
      type: 'bar',
      data: [200, 300, 400, 500]
    },
    {
      name: '图例2',
      type: 'bar',
      data: [100, 200, 300, 400]
    }
  ]
};

在上述代码中,我们通过设置legend数组来定义两个图例,分别为图例1图例2。然后通过设置textStyle.coloritemStyle.color来分别设置图例文字和图例图标的颜色。同时,通过设置series数组来定义两个柱状图,分别对应两个图例。

通过以上代码,可以实现图例颜色与柱子不同,并且两个图例颜色也不相同的效果

echarts设置图例颜色图例颜色与柱子不同两个图例颜色不同

原文地址: http://www.cveoy.top/t/topic/iVkq 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录