Data labels not showing on bar charts (line works)

[bitflower]

Hi,

I have simply added the plugin to my codebase and the labels showed up on the line chart.

However on column and bar charts there a re no labels.

My config for the charts is basic - I don't do any configuring.

I use angular-charts wrapper btw.

Do I have to handle bar charts specifically. As i noticed from your example I don't?

Thanks

[simonbrunel]

@bitflower no special configuration but you may need to adjust the formatter if your data have a special structure. Can you share a fiddle or website that reproduces your issue?

[bitflower]

The hint with the formatter was a good pointer. I started to "see" my data and could fix it from there.

[simonbrunel]

Can you share your data format and solution (formatter), could be useful for others?

[bitflower]

Basically it helped me to "believe" that the data is being loaded correctly and that it is a number. Knowing this I further tweaked the color and backgroundColor options of the datalabels. With this I found out that the font and the rectangle were the same color. I then set the background to white and used the align and anchor settings to position my labels. After all it was a little journey but your plugin is awesome.

function formatValue(val, context) {
  //console.log('Column Chart', val);
  return val.toFixed(2);
}

vm.chartOptions = {
  plugins: {
    datalabels: {
      display: true,
      formatter: formatValue
    }
  },
};

// Options
Chart.defaults.global['plugins'] = {
    datalabels: {
        display: false,
        color: '#333333', //'#FFFFFF', //'#88a4d4',
        //backgroundColor: '#88a4d4', //'#FFFFFF',
        anchor: 'end',
        align: 'start',
        offset: 10,
        //borderRadius: 2,
        //padding: 5
    }
};

Edit(SB): code formatting

[simonbrunel]

Thanks @bitflower

[bitflower]

Hey @simonbrunel , now I learned how to markdown format JS code ;-)

[mystiquewolf]

For me setting the clamp property of plugins -> datalabels object to true solved the issue, version 0.6.0