2020年10月4日日曜日

Chart.jsで特定のデータセットだけ凡例を表示する。

  グラフ中にデータセットが多いと凡例も多くなり返って見辛い。。

特定のデータだけ凡例を出すということができないかと思っていたらできた!

 凡例の設定をする options.legend はデータごとに記載はできない。が以下のようにすると表示対象を絞ることができる。

      legend: {

        display: true,

        position: 'left',

        labels: {

          filter: function(items, chartData) {

            return items.text.startsWith("累計")

          }

        },

        reverse: true

      } 

 これだとラベルが「累計」で始まるデータの凡例だけを表示する。

reverse: trueは凡例の並び順をデータ順と逆にするために設定。線グラフの積み上げグラフだと初めてにデータ定義した方が下に来てしまうのでわかりやすくするため凡例も並びが同じなるようにしている。

 

 

0 件のコメント:

コメントを投稿