Echarts series.itemStyle.opacity bug reproduction

by Oliya

HTML

<script charset="utf-8" src="https://cdn.jsdelivr.net/npm/[email protected]/dist/echarts.min.js"></script>
<div id="chart"></div>

CSS

#chart {
  width: 800px;
  height: 500px;
  margin: 50px auto;
}

JavaScript

const chart = echarts.init(document.getElementById("chart"), "", { renderer: "svg" });

chart.setOption({
  dataset: {
    source: [
      {
        category: "Category 1",
        revenueGross: 123,
        revenueGrossPrevious: 153,
        revenueNet: 98,
        revenueNetPrevious: 124,
      },
      {
        category: "Category 2",
        revenueGross: 235,
        revenueGrossPrevious: 143,
        revenueNet: 201,
        revenueNetPrevious: 102,
      }
    ],
  },
  series: [
    {
      type: "bar",
      dimensions: ["category", "revenueGross"],
      name: "Revenue gross"
    },
    {
      type: "bar",
			dimensions: ["category", "revenueGrossPrevious"],
      name: "Revenue gross: previous",
      itemStyle: {
      		color: "#5470c6",
          opacity: 0.5,
      }
    },
    {
      type: "bar",
      dimensions: ["category", "revenueNet"],
      name: "Revenue net",
		},
    {
      type: "bar",
      dimensions: ["category", "revenueNetPrevious"],
      name: "Revenue net: previous",
			itemStyle: {
      		color: "#91cc75",
          opacity: 0.5,
      }
    },
  ],
  xAxis: {
    type: "category",
    id: "category",
  },
  yAxis: [
    {
      type: "value",
      name: "Revenue",
    },
  ],
  legend: {},
  tooltip: {
    trigger: "axis",
    axisPointer: {
      type: "shadow",
    }
  }
});