RangedHistogram
Return 2 End Function
Public Function GetRanges(ByVal range As IRange, ByVal level As Integer) As IList(Of IRange)
Dim timeRange = TryCast(range, TimeRange) If timeRange Is Nothing Then Return Nothing Dim min = timeRange.TimeMin
Dim max = timeRange.TimeMax Dim span = max - min
Dim ranges As List(Of IRange) = New List(Of IRange)() Dim start As DateTime
If level = 1 Then
start = New DateTime(min.Year,
(CInt(Math.Ceiling(CDbl(min.Month) / 3)) - 1) * 3 + 1, 1)
ranges = Enumerable.Range(0, ((max.Month - start.Month) / 3 + 1) + 4 * (max.Year - start.Year)).[Select](Function(a)
start.AddMonths(a * 3)).TakeWhile(Function(a) a <= max).[Select]
(Function(a) CType((New TimeRange("Q" & CInt(Math.Ceiling(CDbl(a.Month) / 3)), a, a.AddMonths(3))), IRange)).ToList()
Else
start = New DateTime(min.Year, 1, 1)
ranges = Enumerable.Range(0, max.Year - start.Year + 1).
[Select](Function(a) start.AddYears(a)).TakeWhile(Function(a) a <= max).
[Select](Function(a) CType((New TimeRange(a.ToString("yyyy"), a, a.AddYears(1))), IRange)).ToList()
End If
Return ranges End Function End Class
End Class
public partial class Form1 : Form
{
Random rnd = new Random();
public Form1() {
InitializeComponent();
//
チャートタイプとバインディングを設定しますflexChart1.ChartType = ChartType.Line;
flexChart1.DataSource = CreateData();
flexChart1.BindingX = "Time";
flexChart1.Binding = "Price";
//
軸グループを設定しますflexChart1.AxisX.GroupProvider = new DateTimeGroupProvider();
flexChart1.AxisX.Format = "MMM";
flexChart1.AxisX.GroupVisibilityLevel = 1;
flexChart1.Series.Clear();
flexChart1.AxisX.GroupSeparator = AxisGroupSeparator.Grid;
//
系列を追加します C#var series = new Series();
flexChart1.Series.Add(series);
}
public class DateTimeGroupProvider : IAxisGroupProvider {
public int GetLevels(IRange range) {
return 2;
}
public IList<IRange> GetRanges(IRange range, int level) {
var timeRange = range as TimeRange;
if (timeRange == null) return null;
var min = timeRange.TimeMin;
var max = timeRange.TimeMax;
var span = max - min;
List<IRange> ranges = new List<IRange>();
DateTime start;
if (level == 1) {
start = new DateTime(min.Year,
((int)Math.Ceiling((double)min.Month / 3) - 1) * 3 + 1, 1);
ranges = Enumerable.Range(0, ((max.Month - start.Month) / 3 + 1) + 4 * (max.Year - start.Year)).Select(a =>
start.AddMonths(a * 3))
.TakeWhile(a => a <= max)
.Select(a => (IRange)(new TimeRange("Q" +
(int)Math.Ceiling((double)a.Month / 3), a, a.AddMonths(3)))).ToList();
} else {
start = new DateTime(min.Year, 1, 1);
ranges = Enumerable.Range(0, max.Year - start.Year + 1).Select(a => start.AddYears(a))
.TakeWhile(a => a <= max) .Select(a => (IRange)(new
TimeRange(a.ToString("yyyy"), a, a.AddYears(1)))).ToList();
}
return ranges;
} } }
FlexChart の注釈 の注釈
注釈は、チャート内の特定の領域をマークしたり強調表示するために使用するビジュアル要素です。たとえば、テキスト、画 像、図形を使用して、特定のデータポイントに関する重要な情報を表示したり強調表示することができます。チャートを使用す る主な目的は、チャートデータをわかりやすく伝えることです。
FlexChart には、図形、テキスト、画像の 3 つの注釈カテゴリと、8 つのタイプの注釈があります。注釈タイプごとに、さまざまな 方法でチャートデータを有益な情報にすることができます。円、四角形、多角形などの図形で情報を表示したり、わかりやすい メモや画像でデータを強調表示することができます。
さらに、絶対、相対、データインデックス、データ座標などの添付モードを使用して、FlexChart に注釈を配置できます。フォン ト、色、ストロークのスタイル設定プロパティから、注釈とそのコンテンツの両方をカスタマイズできます。ツールチップ、特に画 像注釈を追加して、注釈を対話式にすることができます。
注釈については、次のセクションを参照してください。
注釈の追加 注釈の配置 注釈のカスタマイズ 注釈のタイプ 吹き出しの作成
注釈の追加 注釈の追加
FlexChart では、注釈レイヤに注釈を追加できます。注釈レイヤには、チャート内のすべての注釈のコレクションが含まれま す。
FlexChart に注釈を追加するには、次の手順に従います。
1. FlexChart で注釈レイヤを作成します。
2. 注釈レイヤに注釈インスタンスを追加します。
FlexChart で注釈レイヤを作成するには、FlexChart をパラメータとして渡して AnnotationLayer クラスのインスタンスを作成 します。注釈レイヤに注釈を追加するには、注釈のタイプに対応する注釈クラスのインスタンスを作成します。その注釈インス タンスを注釈レイヤの Annotations コレクションに追加します。
次のコードスニペットは、FlexChart で四角形注釈を作成し、それを注釈レイヤに追加する方法を示します。
Visual Basic
' AnnotationLayerのインスタンスを作成し、FlexChartをパラメータとして渡します
Dim annotationLayer As New C1.Win.Chart.Annotation.AnnotationLayer(FlexChart1) ' 矩形注釈のインスタンスを作成します
Dim rect As New C1.Win.Chart.Annotation.Rectangle ("関税および手数料" & vbLf & "2013" & vbLf & "45000") ' 注釈レイヤの注釈コレクションに注釈を追加します
annotationLayer.Annotations.Add(rect) C#
// AnnotationLayerのインスタンスを作成し、FlexChartをパラメータとして渡します C1.Win.Chart.Annotation.AnnotationLayer annotationLayer = new C1.Win.Chart.Annotation.AnnotationLayer(flexChart1);
// 矩形注釈のインスタンスを作成します
C1.Win.Chart.Annotation.Rectangle rect =
new C1.Win.Chart.Annotation.Rectangle("関税および手数料\n2013\n45000");
// 注釈レイヤの注釈コレクションに注釈を追加します annotationLayer.Annotations.Add(rect);
注釈の配置 注釈の配置
FlexChart の注釈の配置には、次の 2 つのメカニズムがあります（順序は不同）。
チャートに相対的に注釈を配置する。
データポイントに相対的に注釈を配置する。
チャートに相対的に注釈を配置するチャートに相対的に注釈を配置する
チャートに相対的に注釈を配置する場合は、チャート内の注釈の添付と場所を指定します。
FlexChart で注釈を添付する方法は、次の 4 つがあります。
Absolute：この添付は、アプリケーションのサイズ変更に関係なく、注釈が固定されて移動しないことを示します。絶対 添付を設定するには、Attachment プロパティを AnnotationAttachment 列挙の Absolute に設定します。絶対添 付モードで注釈の場所を設定するには、注釈の座標をピクセル単位で設定します。
DataCoordinate：この添付は、注釈が特定のデータポイントに添付されることを示します。この添付を設定するには、
Attachment プロパティを AnnotationAttachment 列挙の DataCoordinate に設定します。注釈の位置を設定するに は、Location プロパティを設定して、注釈のデータ座標を指定します。
DataIndex：この添付は、系列のインデックスに基づいて系列に、ポイントインデックスに基づいてポイントに、注釈が 添付されることを示します。この添付を設定するには、Attachment プロパティを AnnotationAttachment 列挙の DataIndex に設定します。注釈の場所を指定するには、SeriesIndex および PointIndex プロパティを設定します。
Relative：この添付は、注釈がチャートに相対的な場所とサイズを持つことを示します。この添付を設定するには、
Attachment プロパティを AnnotationAttachment 列挙の Relative に設定します。Location プロパティを使用して、
チャート内の相対的な注釈の場所を指定します。（0, 0）は左上、（1, 1）は右下です。
データポイントに相対的に注釈を配置するデータポイントに相対的に注釈を配置する
AnnotationPosition 列挙の Position プロパティを設定して、データポイントに対する注釈の場所を指定します。
次の図に、2013 年の最大の税収入を強調表示する四角形注釈を示します。
次のコードは、9 年間の税収入データを比較し、最大の収入を表示します。このコードは、FlexChart の注釈レイヤに四角形注 釈の添付、場所、位置を指定する方法を示します。
Visual Basic
' 注釈のAttachmentを指定します
rect.Attachment = C1.Chart.Annotation.AnnotationAttachment.DataIndex ' 注釈の位置を設定します
rect.SeriesIndex = 0 rect.PointIndex = 5
' 注釈のポジションを設定します
rect.Position = C1.Chart.Annotation.AnnotationPosition.Top ' 注釈の寸法を指定します
rect.Height = 50 rect.Width = 140 ' 注釈スタイルを設定します
rect.Style.FillColor = Color.FromArgb(200, Color.Transparent) C#
// 注釈のAttachmentを指定します
rect.Attachment = C1.Chart.Annotation.AnnotationAttachment.DataIndex;
// 注釈の位置を設定します rect.SeriesIndex = 0;
rect.PointIndex = 5;
// 注釈の位置を設定します
rect.Position = C1.Chart.Annotation.AnnotationPosition.Top;
// 注釈の寸法を指定します rect.Height = 50;
rect.Width = 140;
// 注釈スタイルを設定します
rect.Style.FillColor = Color.FromArgb(200, Color.Transparent);
注釈のカスタマイズ 注釈のカスタマイズ
FlexChart の注釈は、サイズ（図形）、スケーリング（画像）、コンテンツスタイル（画像以外）をカスタマイズできます。
サイズサイズ：対応するクラスのサイズプロパティを使用して、すべての図形のサイズを変更します。たとえば、四角形注釈の サイズを変更するには、Rectangle クラスの Height および Width プロパティを設定します。
スタイルスタイル：AnnotationBase クラスの Style プロパティを使用して、図形およびテキスト注釈の外観の色、フォント、スト ロークをカスタマイズします。
コンテンツスタイルコンテンツスタイル：AnnotationBase クラスの ContentStyle プロパティを使用して、図形注釈内のコンテンツの外観 をカスタマイズします。
次の図に、2013 年の最大の税収入をさらに強調表示するようにカスタマイズされた四角形注釈を示します。
次のコードは、9 年間の税収入データを比較し、最大の収入を表示します。このコードは、四角形注釈のサイズを設定し、外観 とコンテンツをカスタマイズする方法を示します。
Visual Basic
' 注釈のディメンションを指定します rect.Height = 50
rect.Width = 140
' 注釈スタイルとコンテンツスタイルをカスタマイズします
rect.Style.FillColor = Color.FromArgb(200, Color.DarkBlue) rect.Style.StrokeColor = Color.OrangeRed
rect.Style.StrokeWidth = 2
rect.Style.StrokeDashPattern = New Single() {1.0F, 2.0F}
rect.ContentStyle.StrokeColor = Color.Yellow rect.ContentStyle.Font =
New System.Drawing.Font(FontFamily.GenericSansSerif, 8.5F, FontStyle.Bold) C#
// 注釈のディメンションを指定します rect.Height = 50;
rect.Width = 140;
// 注釈のスタイルとコンテンツスタイルをカスタマイズします
rect.Style.FillColor = Color.FromArgb(200, Color.DarkBlue);
rect.Style.StrokeColor = Color.OrangeRed;
rect.Style.StrokeWidth = 2;
rect.Style.StrokeDashPattern = new[] { 1f, 2f };
rect.ContentStyle.StrokeColor = Color.Yellow;
rect.ContentStyle.Font =
new System.Drawing.Font(FontFamily.GenericSansSerif, 8.5F, FontStyle.Bold);
注釈のタイプ 注釈のタイプ
FlexChart には、次の 3 つのカテゴリと 8 つのタイプの注釈があります。
図形図形：円、楕円、四角形、正方形、線、多角形などの図形を使用して、チャートデータ内の特定の領域に有益な情報を表 示したり、それらの領域を強調表示します。
テキストテキスト：テキスト注釈を使用して、説明用のメモや情報用のコメントをチャート内の特定のポイントに追加します。
画像画像：画像注釈を使用して、一目でわかる画像によってチャートデータの意味が伝わりやすくします。
FlexChart が提供するさまざまな注釈タイプについては、次のセクションを参照してください。
図形注釈 テキスト注釈 画像注釈
図形注釈 図形注釈
図形には、重要なデータを含む領域を強調表示してユーザーの注意を引きつける効果があります。
FlexChart は、次の 6 つの図形注釈を提供します。
円 楕円 線 多角形 四角形 正方形
次の図に、2016 年の最大の関税額および通関手数料を強調表示した線注釈を示します。
これらの図形を作成するには、図形注釈クラスのインスタンスを作成します。対応するクラスのサイズプロパティを使用して、図形のサイズを設 定します。たとえば、線注釈を作成するには、Line クラスのインスタンスを作成します。Line クラスの Start および End プロパティを設定して、
線注釈の長さを指定したり、線注釈を回転させます。
すべての図形注釈の基本クラスである Shape クラスの Content プロパティを設定して、テキストを指定します。さらに、FlexChart の多角形注 釈を使用すると、三角形や矢印などの図形も作成できます。
次のコードは、商品の輸入関税データを使用して、2016 年のデータの増減を示します。このコードは、FlexChart の線注釈を追加、配置、カスタ マイズする方法を示します。
Visual Basic
' 注釈のインスタンスを作成します。
Dim line As New C1.Win.Chart.Annotation.Line() ' 線の内容を指定します。
line.Content = "最大関税および手数料：31000"
' 線の開始点と終了点を指定します。