[TrueChart for WinForms] 折れ線グラフのラインがデータ点をはみ出してしまいます。

文書番号 : 69737     文書種別 : Info
登録日 : 2014/09/26     最終更新日 : 2017/12/07

対象製品

Studio for WinForms

詳細

折れ線グラフのラインが鋭角で折り返す場合、線の幅が太くなるにつれ、本来の座標よりも外側の部分にはみ出して描画されてしまいます。
これは、GDI+のGraphicsオブジェクトにおいて、直線の接合方法がデフォルトで鋭角接合(LineJoin.Miter)である為です。

C1Chart.DrawDataSeriesイベントを実装し、折れ線の描画に使用するPenのLineJoinプロパティを「Bevel」や「Round」に設定することで、現象を回避できます。

※この方法により、データセット(Series)の線の設定内容はPenオブジェクトによって上書きされる為、線の種類/色/太さは、改めて設定し直す必要があります。

◆サンプルコード

[VB]
Private Sub C1Chart1_DrawDataSeries(ByVal sender As System.Object, _
ByVal e As C1.Win.C1Chart.DrawDataSeriesEventArgs) Handles C1Chart1.DrawDataSeries
  '接合方法を変更するデータセットを判断します
  If e.SeriesIndex = 0 Then
    Dim pen As New Pen(Color.Red, 3)

    '鋭角接合(デフォルト:はみ出しが発生します)
    'pen.LineJoin = System.Drawing.Drawing2D.LineJoin.Miter

    '面取り接合(現象を回避できます)

    pen.LineJoin = System.Drawing.Drawing2D.LineJoin.Bevel

    '角丸接合(現象を回避できます)
    'pen.LineJoin = System.Drawing.Drawing2D.LineJoin.Round


    e.Pen = pen
  End If
End Sub


[C#]
private void c1Chart1_DrawDataSeries(object sender, C1.Win.C1Chart.DrawDataSeriesEventArgs e)
{
  //接合方法を変更するデータセットを判断します
  if (e.SeriesIndex == 0)
  {
    Pen pen = new Pen(Color.Red, 3);
    
    //鋭角接合(デフォルト:はみ出しが発生します)
    //pen.LineJoin = System.Drawing.Drawing2D.LineJoin.Miter;
    
    //面取り接合(現象を回避できます)

    pen.LineJoin = System.Drawing.Drawing2D.LineJoin.Bevel;
    
    //角丸接合(現象を回避できます)
    //pen.LineJoin = System.Drawing.Drawing2D.LineJoin.Round;

    
    e.Pen = pen;
  }
}


(2017.12.07 追記)

LineJoinプロパティを「Miter」にしておく場合は、SeriesのLineStyle.MiterLimitを小さめの値に設定することで回避可能です。
 ※下記サンプルコードでは「2」に設定していますが、お客様のアプリケーションに合わせて調整してください。

◆サンプルコード
 
[VB]
Dim series As ChartDataSeries = c1Chart1.ChartGroups(0).ChartData.SeriesList.AddNewSeries
series.LineStyle.Thickness = 2
series.LineStyle.LineJoin = System.Drawing.Drawing2D.LineJoin.Miter
series.LineStyle.MiterLimit = 2

[C#]
ChartDataSeries series = c1Chart1.ChartGroups[0].ChartData.SeriesList.AddNewSeries();
series.LineStyle.Thickness = 2;
series.LineStyle.LineJoin = System.Drawing.Drawing2D.LineJoin.Miter;
series.LineStyle.MiterLimit = 2;