0

I'm getting this console error when I try to add the third axis and give yaxis index to the line graph data.

enter image description here

widgetData: [
        {
          name: 'AssignmentHours.Hours',
          type: 'bar',
          data: getChartData(
            [20, 40, 60, 80, 100, 120, 140, 160, 180, 200, 220, 240],
            'serviceSpentBudget',
            ColorPalette.HoursSpent
          ),
          yAxisIndex: 0,
        },
        {
          data: getChartData(
            [20, 40, 60, 80, 100, 120, 140, 160, 180, 200, 220, 240],
            'serviceHours',
            ColorPalette.HourBudgeted
          ),
          name: 'AssignmentHours.HoursBudget',
          type: 'bar',
          yAxisIndex: 0,
        },
        // TODO: Replace fake values with BE api values when available.
        {
          name: 'AssignmentDashboard.AccumulatedSpent',
          type: 'line',
          data: [20, 40, 60, 80, 100, 120, 140, 160, 180, 200, 220, 240],
          color: '#0C373C',
          yAxisIndex: 1,
        },
        {
          name: 'AssignmentDashboard.AccumulatedBudget',
          type: 'line',
          data: [20, 30, 50, 70, 85, 105, 130, 150, 180, 220, 240, 260],
          color: '#20909E',
          yAxisIndex: 1,
        },
      ]

private setXAxis() {
this.chartInstance.setOption({
  xAxis: {
    type: 'category',
    data: this.dataLabels?.map((label: string) => {
      return this.translateService.instant(label);
    }),
    axisLine: {
      lineStyle: {
        type: this.widget.axisLineStyle,
      },
    },
    axisTick: {
      show: this.widget.axisTick,
    },
    axisLabel: {
      color: !this.hasData ? palettes.primary[200] : '',
    },
    show: this.hasData,
  },
  yAxis: [
    {
      splitLine: {
        lineStyle: {
          type: this.widget.splitLineStyle,
        },
      },
      axisLabel: {
        show: this.hasData,
      },
    },
    {
      name: 'S',
      splitLine: {
        lineStyle: {
          type: this.widget.splitLineStyle,
        },
      },
      axisLabel: {
        show: this.hasData,
      },
      min: 0,
      max: 25,
      // interval: 5,
    },
  ],
});

}

Harrish Selvarajah
  • 1,763
  • 12
  • 11

0 Answers0