Modifier le style d'étiquette de données Chart.js 4.2.1 dans Vue

Question

J'utilise Vue et ChartJS et je souhaite modifier le style des étiquettes de données.

J'ai 3 étiquettes de données et je souhaite modifier le style de la deuxième étiquette de normal à gras.

Ce que j'ai essayé - 1

plugins : {
    légende: {
        affichage : faux,
    },
    info-bulle : {
        activé : faux,
    },
    étiquettes de données : {
        formateur : fonction (valeur, contexte) {
            si (context.dataIndex === 1) {
                var ctx = contexte.chart.ctx;
                ctx.font = "bold 20px 'Noto Sans Kr', sans-serif";
                ctx.fillStyle = "#333";
                console.log(ctx.fontWeight);
            }
            valeur de retour + "원" ;
        },
    },
},
≪/pré>
Ce que j'ai essayé - 2
plugins : {
    légende: {
        affichage : faux,
    },
    info-bulle : {
        activé : faux,
    },
    étiquettes de données : {
        formateur : fonction (valeur, contexte) {
            si (context.dataIndex === 1) {
                retour {
                    texte : valeur,
                    style : {
                        poids : "gras"
                    }
                }
            }
            valeur de retour + "원" ;
        },
    },
},
≪/pré>
Le texte renvoyé par la deuxième méthode est [object object], je ne peux donc pas confirmer que le style fonctionne correctement. 
Veuillez m'aider à modifier les styles individuels de la base de données. 
            

Answer 1

Pour modifier les polices, vous devez implémenter des options scriptables font 而不是 formatter.

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