-2

I am trying to show data labels only for the line chart in a mixed/combo chart type (line & bar) but I couldn't find a way to disable it for the bar series.

it is possible to visualize the code in this link Here is my existing code.

var options = {
      chart: {
        height: 310,
        type: 'line',
        stacked: false,
      },
      series: [{
        name: 'Series Column',
        type: 'column',
        data: [23, 11, 22, 27, 13, 22, 37, 21, 44, 22, 30]
      }, {
        name: 'Series Area',
        type: 'area',
        data: [44, 55, 41, 67, 22, 43, 21, 41, 56, 27, 43]
      }, {
        name: 'Series Line',
        type: 'line',
        data: [30, 25, 36, 30, 45, 35, 64, 52, 59, 36, 39]
      }],           
      markers: {
        size: 0
      },
      dataLabels: {
        enabled: true
      },
      xaxis: {
        type:'datetime'
      },
      yaxis: {
        title: {
          text: 'Points',
        },
        min: 0
      },
      

    }

    var chart = new ApexCharts(
      document.querySelector("#chart"),
      options
    );

    chart.render();

Is there an option to turn off data-labels for specific series in a mixed chart?

Edvaldo Lucena
  • 15
  • 1
  • 7

1 Answers1

2

Currently, there is no option to turn on/off data-labels series wise. It is enabled for all series. I am opening an issue on GitHub to implement it in the next release.

EDIT: A new option enabledOnSeries is shipped in v3.5.0. You can use it like

options = {
  dataLabels: {
    enabled: true,
    enabledOnSeries: [1, 2]
  }
}

The above will show data-labels only for series with index 1,2 and disable data-labels on series with index 0 (in your example - the column series)

Disclaimer: I am the author of ApexCharts.

junedchhipa
  • 4,694
  • 1
  • 28
  • 28
  • Thank you, I will wait. – Edvaldo Lucena Feb 23 '19 at 13:57
  • Released a new version 3.5.0 which allows enabling data-labels on specific series - https://apexcharts.com/docs/options/datalabels/#enabledOnSeries – junedchhipa Feb 25 '19 at 10:26
  • Is it necessary to download the library again or just add the code to my chart? – Edvaldo Lucena Feb 25 '19 at 11:28
  • Not necessary to download if you are using the CDN link directly. Please use this - https://cdn.jsdelivr.net/npm/apexcharts@latest – junedchhipa Feb 25 '19 at 14:01
  • I made the note for the link that you passed and I added the code to enable the data series, but it is still displaying the labels for all the series. Can you tell me what's wrong in the code below? – Edvaldo Lucena Feb 25 '19 at 16:53
  • – Edvaldo Lucena Feb 25 '19 at 16:54
  • Edited my answer. Please use the property enabledOnSeries. – junedchhipa Feb 26 '19 at 01:46