ホームページ  >  に質問  >  本文

Vue で Chart.js 4.2.1 データ ラベル スタイルを変更する

<p>Vue と ChartJS を使用していますが、データ ラベルのスタイルを変更したいと考えています。 </p> <p>データ ラベルが 3 つあり、2 番目のラベルのスタイルを標準から太字に変更したいと考えています。 </p> <h2>試したこと - 1</h2> <pre class="brush:js;toolbar:false;">プラグイン: { 伝説: { 表示: 偽、 }、 ツールチップ: { 有効: false、 }、 データラベル: { フォーマッタ: 関数 (値、コンテキスト) { if (context.dataIndex === 1) { var ctx = context.chart.ctx; ctx.font = "太字 20px 'Noto Sans Kr'、サンセリフ"; ctx.fillStyle = "#333"; console.log(ctx.fontWeight); } 戻り値「원」; }、 }、 }、 </pre> <h2>試したこと - 2</h2> <pre class="brush:js;toolbar:false;">プラグイン: { 伝説: { 表示: 偽、 }、 ツールチップ: { 有効: false、 }、 データラベル: { フォーマッタ: 関数 (値、コンテキスト) { if (context.dataIndex === 1) { 戻る { テキスト: 値、 スタイル : { 重み: '太字' } } } 戻り値「원」; }、 }、 }、 </pre> <p>2 番目のメソッドによって返されるテキストは <strong>[object object]</strong> であるため、スタイルが適切に機能しているかどうかは確認できません。 </p> <p>データベースの個々のスタイルを変更するのにご協力ください。 </p>
P粉541796322P粉541796322412日前625

全員に返信(1)返信します

  • P粉627136450

    P粉6271364502023-09-03 11:27:26

    フォントを変更するには、formatter の代わりにスクリプト可能オプション font を実装する必要があります。

    リーリー

    返事
    0
  • キャンセル返事