作成日: 2022/03/09 最終更新日: 2022/03/09
文書種別
使用方法
詳細
散布図(シンボルのみの折れ線グラフも含む)やローソク足グラフで、指定した特定のデータポイントの色を変更するには、シリーズのSymbolRenderingイベントを使用し、Engine.SetFillメソッド、SetStrokeメソッドを実行します。

◎サンプルコード(VB)

◎サンプルコード(VB)
Imports C1.Chart
Imports C1.Win.Chart
Public Class Form1
Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
' データテーブルの設定
Dim dt1 As DataTable = New DataTable()
dt1.Columns.AddRange(New DataColumn() {
New DataColumn("ID", GetType(Integer)), New DataColumn("個数", GetType(Integer))})
dt1.Rows.Add(1, 10)
dt1.Rows.Add(2, 50)
dt1.Rows.Add(3, 60)
dt1.Rows.Add(4, 30)
dt1.Rows.Add(5, 20)
' (1)散布図
' チャートタイプの設定
FlexChart1.ChartType = ChartType.Scatter
FlexChart1.DataSource = dt1
' FlexChartへのバインド
FlexChart1.BindingX = "ID"
FlexChart1.Binding = "個数"
FlexChart1.Header.Content = "散布図"
FlexChart1.Series(0).Name = ""
'(2)折れ線グラフ(シンボルのみ)
' チャートタイプの設定
FlexChart2.ChartType = ChartType.LineSymbols
FlexChart2.Series(0).Style.Fill = Brushes.Blue
FlexChart2.Series(0).Style.Stroke = Brushes.Transparent
' FlexChartへのバインド
FlexChart2.DataSource = dt1
FlexChart2.BindingX = "ID"
FlexChart2.Binding = "個数"
FlexChart2.Header.Content = "折れ線グラフ(シンボルのみ)"
FlexChart2.Series(0).Name = ""
' (3)ローソク足
'データテーブルの設定
Dim dt2 As DataTable = New DataTable()
dt2.Columns.AddRange(New DataColumn() {
New DataColumn("X", GetType(Integer)),
New DataColumn("Y-High", GetType(Integer)),
New DataColumn("Y-Low", GetType(Integer)),
New DataColumn("Y-Open", GetType(Integer)),
New DataColumn("Y-Close", GetType(Integer))
})
dt2.Rows.Add(1, 120, 95, 110, 110)
dt2.Rows.Add(2, 135, 105, 115, 115)
dt2.Rows.Add(3, 140, 110, 120, 120)
dt2.Rows.Add(4, 110, 90, 100, 100)
dt2.Rows.Add(5, 130, 90, 105, 105)
' チャートタイプの設定
FlexChart3.ChartType = ChartType.Candlestick
' FlexChartへのバインド
FlexChart3.DataSource = dt2
FlexChart3.BindingX = "X"
FlexChart3.Binding = "Y-High,Y-Low,Y-Open,Y-Close"
FlexChart3.Header.Content = "ローソク足"
FlexChart3.Series(0).Name = ""
' SymbolRenderingイベントの追加
Dim series1 As Series = FlexChart1.Series(0)
AddHandler series1.SymbolRendering, AddressOf series1_SymbolRendering
Dim series2 As Series = FlexChart2.Series(0)
AddHandler series2.SymbolRendering, AddressOf series2_SymbolRendering
Dim series3 As Series = FlexChart3.Series(0)
AddHandler series3.SymbolRendering, AddressOf series3_SymbolRendering
End Sub
Private Sub series1_SymbolRendering(ByVal sender As Object, ByVal e As RenderSymbolEventArgs)
If e.Index = 2 Then
e.Engine.SetFill(Brushes.Red)
e.Engine.SetStroke(Brushes.Yellow)
End If
End Sub
Private Sub series2_SymbolRendering(ByVal sender As Object, ByVal e As RenderSymbolEventArgs)
If e.Index = 2 Then
e.Engine.SetFill(Brushes.Red)
e.Engine.SetStroke(Brushes.Yellow)
End If
End Sub
Private Sub series3_SymbolRendering(ByVal sender As Object, ByVal e As RenderSymbolEventArgs)
If e.Index = 2 Then
e.Engine.SetStroke(Brushes.DarkRed)
End If
End Sub
End Class
◎サンプルコード(C#)
using C1.Chart;
using C1.Win.Chart;
namespace prj_C1FlexChart
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
//データテーブルの設定
DataTable dt1 = new DataTable();
dt1.Columns.AddRange(new DataColumn[]{
new DataColumn("ID", typeof(Int32)),new DataColumn("個数", typeof(Int32))});
dt1.Rows.Add(1, 10);
dt1.Rows.Add(2, 50);
dt1.Rows.Add(3, 60);
dt1.Rows.Add(4, 30);
dt1.Rows.Add(5, 20);
//(1)散布図
// チャートタイプの設定
flexChart1.ChartType = ChartType.Scatter;
// FlexChartへのバインド
flexChart1.DataSource = dt1;
flexChart1.BindingX = "ID";
flexChart1.Binding = "個数";
flexChart1.Header.Content = "散布図";
flexChart1.Series[0].Name = "";
//(2)折れ線グラフ(シンボルのみ)
// チャートタイプの設定
flexChart2.ChartType = ChartType.LineSymbols;
flexChart2.Series[0].Style.Fill = Brushes.Blue;
flexChart2.Series[0].Style.Stroke = Brushes.Transparent;
// FlexChartへのバインド
flexChart2.DataSource = dt1;
flexChart2.BindingX = "ID";
flexChart2.Binding = "個数";
flexChart2.Header.Content = "折れ線グラフ(シンボルのみ)";
flexChart2.Series[0].Name = "";
// (3)ローソク足
//データテーブルの設定
DataTable dt2 = new DataTable();
dt2.Columns.AddRange(new DataColumn[]
{
new DataColumn("X", typeof(Int32)),
new DataColumn("Y-High", typeof(double)),
new DataColumn("Y-Low", typeof(double)),
new DataColumn("Y-Open", typeof(double)),
new DataColumn("Y-Close", typeof(double))
});
dt2.Rows.Add(1, 120, 95, 110, 110);
dt2.Rows.Add(2, 135, 105, 115, 115);
dt2.Rows.Add(3, 140, 110, 120, 120);
dt2.Rows.Add(4, 110, 90, 100, 100);
dt2.Rows.Add(5, 130, 90, 105, 105);
// チャートタイプの設定
flexChart3.ChartType = ChartType.Candlestick;
// FlexChartへのバインド
flexChart3.DataSource = dt2;
flexChart3.BindingX = "X";
flexChart3.Binding = "Y-High,Y-Low,Y-Open,Y-Close";
flexChart3.Header.Content = "ローソク足";
flexChart3.Series[0].Name = "";
}
private void Form1_Load(object sender, EventArgs e)
{
// SymbolRenderingイベントの追加
Series series1 = flexChart1.Series[0];
series1.SymbolRendering += series1_SymbolRendering;
Series series2 = flexChart2.Series[0];
series2.SymbolRendering += series2_SymbolRendering;
Series series3 = flexChart3.Series[0];
series3.SymbolRendering += series3_SymbolRendering;
}
private void series1_SymbolRendering(object sender, RenderSymbolEventArgs e)
{
if (e.Index == 2)
{
e.Engine.SetFill(Brushes.Red);
e.Engine.SetStroke(Brushes.Yellow);
}
}
private void series2_SymbolRendering(object sender, RenderSymbolEventArgs e)
{
if (e.Index == 2)
{
e.Engine.SetFill(Brushes.Red);
e.Engine.SetStroke(Brushes.Yellow);
}
}
private void series3_SymbolRendering(object sender, RenderSymbolEventArgs e)
{
if (e.Index == 2)
{
e.Engine.SetStroke(Brushes.DarkRed);
}
}
}
}