4

プロジェクトでChartJSを使用しています(元のライブラリの上に構築されたAngular 2のより正確にはng2-charts)。

オプションがあることがわかりました:

凡例: false|true

ただし、上部の凡例(たとえば、折れ線グラフの各行を説明するもの)を削除できるのは特に面倒です。以下に、私が何を意味するかを示します。

ここに画像の説明を入力

で試しました

.chart-legend {
  visibility: hidden;
  display: none;
}

Chartjs Legend Stylingからインスピレーションを得ています

しかし、それは他の伝説(下の伝説)にも当てはまると思います。上部の凡例をカスタマイズ/非表示にする方法はありますか?

また、x/y 軸のラベルの向きを変更するオプションはありますか? (たとえば、斜めではなく垂直に表示する)

4

1 に答える 1

13

グラフを作成するときに、一連のグラフ オプションを指定できます。可能なオプションの 1 つはLegend Configurationです。凡例を非表示にするには、次のようなオプションを使用します。

options: {
    legend: { display: false }
}

私は ng2-charts を使用していませんが、ドキュメント(特にチャートの例) を見ると、次のようにチャートの凡例ブール値を簡単に定義できるようです:

public lineChartLegend:boolean = true;

次に、この値を次のようにグラフに追加します。

   <base-chart class="chart"
                   ...
                   [legend]="lineChartLegend"
                   [chartType]="lineChartType"
                   ...></base-chart>

最後に、Chartjs Legend Styling ソリューションが機能しない理由として考えられるのは、chart.js v1.x 用に設計されていることですが、ng2-charts は chart.js v2.x で機能するように見えますが、これは以前のバージョンに対する大きな変更です。バージョン。

お役に立てれば!

于 2016-08-02T22:55:31.147 に答える