Bar chart unable to put label for min value and max value for each bar chart

1

Dear Sir,

we are trying to add labels for each bar for min value and max value. we have setup demo in js it is working good but when we try to pass same thing in api it is not wokring please see attached images

expected
expected731×347 13.5 KB

2

above is wrong output i am getting

current wrong output
current wrong output877×362 12.7 KB

3

Can you share the chart configuration that you’re using, and/or an example chart URL?

4

please check below json request

{
“backgroundColor”: “#fff”,
“width”: 700,
“height”: 300,
“devicePixelRatio”: 1.0,
“format”:“png”,
“version”:3,
“chart”: {
“type”: “bar”,
“data”: {
“labels”: [2012, 2013, 2014],
“datasets”: [
{
“label”: “Users”,
“data”: [[10, 30], [20, 50], [30, 60]],
“backgroundColor”: [“#74be4e”, “#e9cb1d”, “#c10200”]
},
{
“label”: “Test”,
“data”: [0,0,0],
“backgroundColor”: [“#74be4e”, “#e9cb1d”, “#c10200”]
}
]
},
“options”: {
“plugins”: {
“datalabels”: {
“anchor”: “(context) => (context.datasetIndex === 0) ? ‘start’ : ‘end’”,
“align”: “(context) => (context.datasetIndex === 0) ? "bottom" : "top"”,
“display”: true,
“color”: “black”,
“formatter”: “(value, context) => (context.datasetIndex === 0) ? Math.min(…context.chart.data.datasets[0].data[context.dataIndex]) : Math.max(…context.chart.data.datasets[0].data[context.dataIndex])”
},
“legend”:{
“display”: false
}
},
“scales”: {
“x”: {
“grid”:{
“display”: false
},
“stacked”: true
},
“y”: {
“grid”:{
“display”: false
},
“max”: 80,
“stacked”: true
}
}
},
“plugins”: [“ChartDataLabels”]
}
}

anchor
formatter
align
none of above function working in the post request.

5

Hello,

You shouldn’t be putting Javasript functions in “double quotes”. See Using Javascript functions | QuickChart

Ian