An axis is a horizontal or vertical line that displays measurement units while plotting a sparkline. It serves as a reference for the data points in sparkline. The Sparkline control supports an x-axis, which can either be displayed or kept hidden as per the user requirements. This topic discusses various properties that can be applied to Axis in the Sparkline control.

X軸の表示

デフォルトでは、Sparkline コントロールは軸をレンダリングしません。 However, at times, there may be a need to display the horizontal axis, i.e., x-axis, to better visualize values greater than and less than zero. 軸を表示するには、C1SparklineクラスのDisplayXAxis プロパティを true に設定する必要があります。

The following code shows how to display the x-axis in Sparkline.

<c1:C1Sparkline x:Name="sparkline" DisplayXAxis="True" Height="250" Width="250"  />

sparkline.DisplayXAxis = true;

日付軸の設定

スパークラインは日付軸をサポートし、いくつかの日付にわたるデータを X 軸にプロットします。日付軸は、不定な間隔でデータを表示できる形態の X 軸に過ぎません。日付軸は日付のコレクションを受け取り、これらの日付を X 座標としてデータをプロットします。この方法で、いくつかの日付にわたるデータをプロットできます。

C1Sparkline クラスには DisplayDateAxis プロパティがあり、これを true に設定すると、いくつかの日付にわたるデータを表示できます。次の図は、Sparkline コントロールに不定な間隔でプロットされたデータです。

日付軸を設定するには、X 軸となる日付の列挙可能なコレクションを提供し、これを DateAxisData プロパティに設定します。次の図に示すように、以下の手順に従って、Sparklineで日付軸を設定および表示します。

この例では、「クイックスタート」で作成したサンプルを使用します。

1. クイックスタートで作成したSampleData.csクラスに次のコードを追加して、列挙可能な日付のコレクションを作成します。

   C#

   コードのコピー

   public List<DateTime> DefaultDateAxisData { get { List<DateTime> dates = new List<DateTime>(); dates.Add(new DateTime(2016, 1, 1)); dates.Add(new DateTime(2016, 1, 15)); dates.Add(new DateTime(2016, 2, 1)); dates.Add(new DateTime(2016, 3, 3)); dates.Add(new DateTime(2016, 4, 6)); dates.Add(new DateTime(2016, 6, 11)); dates.Add(new DateTime(2016, 7, 19)); dates.Add(new DateTime(2016, 9, 1)); return dates; } }

2. MainWindow.xaml.csファイルに切り替え、次のコードを追加して、DateAxisDataプロパティを使用して日付コレクションをスパークラインに割り当てます。

   C#	コードのコピー
   sparkline.DateAxisData = sampleData.DefaultDateAxisData; sparkline.DisplayXAxis = true;