Wpf 如何创建断开连接的线图？

我正在使用Silverlight和WPF股票交易应用程序。我正在尝试创建一个类似于散线图的图

我怎么画这个图表？可以通过Silverlight Toolkit graph完成吗？或者有人能给我推荐一个简单但好看的图表库吗

我用油漆画了这张图表，供你参考。

---

为什么不使用标准WPF/Silverlight绘图方法？因为您的需求并不太复杂，所以您可以使用一些线条和矩形来创建画布：

private void AddEdge(Point from, Point to, int nodeWidth)
{
    Line line = new Line()
    {
        X1 = from.X,
        Y1 = from.Y,
        X2 = to.X,
        Y2 = to.Y,
        Stroke = Brushes.Black,
    };

    Rectangle nodeFrom = new Rectangle()
    {
        Height = nodeWidth,
        Width = nodeWidth,
        Fill = Brushes.Black,
    };
    Canvas.SetLeft(nodeFrom, from.X - nodeWidth / 2);
    Canvas.SetTop(nodeFrom, from.Y - nodeWidth / 2);

    Rectangle nodeTo = new Rectangle()
    {
        Height = nodeWidth,
        Width = nodeWidth,
        Fill = Brushes.Black,
    };
    Canvas.SetLeft(nodeTo, to.X - nodeWidth / 2);
    Canvas.SetTop(nodeTo, to.Y - nodeWidth / 2);

    LayoutRoot.Children.Add(line);
    LayoutRoot.Children.Add(nodeFrom);
    LayoutRoot.Children.Add(nodeTo);
}

然后可以轻松添加边：

Point from = new Point(15, 15);
Point to = new Point(100, 200);

AddEdge(from, to, 8);

也可以根据需要自定义节点和线的样式，只需更改笔刷即可

---

希望有帮助

您可以轻松使用创建上面的图表。我已经附加了下面的XAML代码

<vc:Chart xmlns:vc="clr-namespace:Visifire.Charts;assembly=SLVisifire.Charts" Theme="Theme1" Width="500" Height="300">

            <vc:Chart.Series>
                <vc:DataSeries RenderAs="Line">
                    <vc:DataSeries.DataPoints>
                        <vc:DataPoint XValue="1" YValue="6"></vc:DataPoint>
                        <vc:DataPoint XValue="2" YValue="10"></vc:DataPoint>
                        <vc:DataPoint XValue="1.5" YValue="" ></vc:DataPoint>
                        <vc:DataPoint XValue="1.5" YValue="5" ></vc:DataPoint>
                        <vc:DataPoint XValue="3" YValue="3" ></vc:DataPoint>
                        <vc:DataPoint XValue="2.8" YValue="" ></vc:DataPoint>
                        <vc:DataPoint XValue="2.8" YValue="8" ></vc:DataPoint>
                        <vc:DataPoint XValue="3.5" YValue="12" ></vc:DataPoint>
                        <vc:DataPoint XValue="3.5" YValue="" ></vc:DataPoint>
                        <vc:DataPoint XValue="3.5" YValue="8" ></vc:DataPoint>
                        <vc:DataPoint XValue="4.2" YValue="12" ></vc:DataPoint>
                        <vc:DataPoint XValue="4" YValue="" ></vc:DataPoint>
                        <vc:DataPoint XValue="4" YValue="8" ></vc:DataPoint>
                        <vc:DataPoint XValue="5" YValue="6" ></vc:DataPoint>
                    </vc:DataSeries.DataPoints>
                </vc:DataSeries>
            </vc:Chart.Series>
        </vc:Chart>

正如你所看到的，我在这里使用了带有虚线的单系列

下面是上图XAML的图像

---

你想要漂亮的图表，对吗？那我建议你调查一下Visifire。您可以从Visifire图表库查看以下示例

---

我试过telerik chart。但这对我来说越来越难了。我发现有些事情很简单，所以我可以让我的管理层高兴。我用油漆画了一张图表，供你参考。请看一看。我怀疑你的图表会有这样的缺口，但从你的样本来看，似乎总是有两个对应的点连接在一起？总是有两个对应的点连接在一起。是的，你是对的。但是怎么做…有什么想法吗？我不知道是什么样的这是一张图表，但我不会称之为断开连接的折线图。你知道它的名字吗？看起来很简单。我试试这个。谢谢你的例子。但是Vivek提供的例子对我来说是完美的。Vivek，这个例子对我来说是完美的。正是我想要的。谢谢