<p>I'm using Vue and ChartJS, and I want to change the style of the data labels. </p> <p>I have 3 data labels and I want to change the style of the second label from normal to bold. </p> <h2>What I tried - 1</h2> <pre class="brush:js;toolbar:false;">plugins: { legend: { display: false, }, tooltip: { enabled: false, }, datalabels: { formatter: function (value, context) { if (context.dataIndex === 1) { var ctx = context.chart.ctx; ctx.font = "bold 20px 'Noto Sans Kr', sans-serif"; ctx.fillStyle = "#333"; console.log(ctx.fontWeight); } return value "원"; }, }, }, </pre> <h2>What I tried - 2</h2> <pre class="brush:js;toolbar:false;">plugins: { legend: { display: false, }, tooltip: { enabled: false, }, datalabels: { formatter: function (value, context) { if (context.dataIndex === 1) { return { text: value, style : { weight: 'bold' } } } return value "원"; }, }, }, </pre> <p>The text returned by the second method is <strong>[object object]</strong>, so I can't confirm that the styling is working properly. </p> <p>Please help me change individual styles of the database. </p>

datalabels: {
    font: (context) => context.dataIndex === 1 ? ({weight: 'bold'}) : undefined 
    formatter: (value) => value + "원"
  },