バージョン

散布ポリライン シリーズの使用

目的

このトピックでは、XamDataChart™ コントロールで ScatterPolylineSeries 要素を使用する方法を提供します。

このトピックの内容

このトピックは、以下のセクションで構成されます。

散布ポリライン シリーズ

概要

XamDataChart コントロールで、ScatterPolylineSeries はポリラインを使用してデータを表示するシリーズです。この散布シリーズのタイプは、ネットワーク グラフなどの切断された折れ線の描画が必要な場合に使用されます。ScatterPolylineSeries は、データが多角形の代わりにポリラインで描画されることを除いて、ScatterPolygonSeries とほどんど同様に機能します。

プレビュー

以下は、様々なポイントの間に接続を描画する ScatterPolylineSeries を持つ XamDataChart コントロールのプレビューです。

DataChart Using Scatter Polyline Series 1.png

データ要件

XamDataChart コントロールのシリーズの他のタイプと同様、ScatterPolylineSeries には、データ バインディングのための ItemsSource プロパティがあります。このプロパティは、IEnumerable インターフェイスを実装するオブジェクトにバインドできます。さらに、このオブジェクトの各項目には、IEnumerable<IEnumerable<Point>> 構造を使用して図形のポイント位置 (X と Y 値) を保存するデータ列が 1 つ必要です。このデータ列は、ShapeMemberPath プロパティにマップされます。ScatterPolylineSeries は、XamDataChart コントロールでポリラインをプロットするために、このマップされたデータ列のポイントを使用します。

例

以上のスクリーンショットでのデータの構造は以下です。

C# の場合:

public class Node
{
    // The lines that branch off this node to other nodes.
    public List<List<Point>> Points { get; set; }
}

Visual Basic の場合:

Public Class Node
    ' The lines that branch off this node to other nodes.
    Private _points As List(Of List(Of Point))
    public Property List(Of List(Of Point)) Points
        Get
            Return _points
        End Get
        Set
            _points = value
        End Set
    End Property
End Class

以下のコードは ScatterPolylineSeries をデータにバインドします。

XAML の場合:

<ig:XamDataChart x:Name="dataChart">
    <ig:XamDataChart.Axes>
        <ig:NumericXAxis x:Name="xAxis"/>
        <ig:NumericYAxis x:Name="yAxis"/>
    </ig:XamDataChart.Axes>
    <ig:XamDataChart.Series>
        <ig:ScatterPolylineSeries ItemsSource="{Binding Path=Nodes}"
                                  ShapeMemberPath="Points"
                                  XAxis="{Binding ElementName=xAxis}"
                                  YAxis="{Binding ElementName=yAxis}"/>
    </ig:XamDataChart.Series>
</ig:XamDataChart>

Visual Basic の場合:

' ScatterPolylineSeries requires numeric X and Y axis
Dim xAxis = New NumericXAxis()
Dim yAxis = New NumericYAxis()
Me.dataChart.Axes.Add(xAxis)
Me.dataChart.Axes.Add(yAxis)

' create and set data binding to the ScatterPolylineSeries
Dim polylineSeries = New ScatterPolylineSeries()
polylineSeries.ItemsSource = Nodes
polylineSeries.ShapeMemberPath = "Points"
polylineSeries.XAxis = xAxis
polylineSeries.YAxis = yAxis

' add the ScatterPolylineSeries to the the XamDataChart
Me.dataChart.Series.Add(polylineSeries)

C# の場合:

// ScatterPolylineSeries requires numeric X and Y axis
var xAxis = new NumericXAxis();
var yAxis = new NumericYAxis();
this.dataChart.Axes.Add(xAxis);
this.dataChart.Axes.Add(yAxis);

// create and set data binding to the ScatterPolylineSeries
var polylineSeries = new ScatterPolylineSeries();
polylineSeries.ItemsSource = Nodes;
polylineSeries.ShapeMemberPath = "Points";
polylineSeries.XAxis = xAxis;
polylineSeries.YAxis = yAxis;

// add the ScatterPolylineSeries to the the XamDataChart
this.dataChart.Series.Add(polyLineSeries);

関連コンテンツ

このトピックに関連する追加情報については、以下のトピックを参照してください。

トピック 目的

このトピックでは、コントロールをアプリケーション ページに追加する方法を示します。

このトピックでは、XamDataChart コントロールで利用可能な散布シリーズに関する情報を提供します。