用于神经网络可视化的 WPF 控件

Question

我正在开发一个神经网络，为了可视化，我正在 WPF 中编写一个 UserControl。

以下代码绘制神经元：

<UserControl x:Class="ExcelAddIn.LogView"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">
<UserControl.Resources>
    <DataTemplate x:Key="ellipse">
        <Grid  Margin="0,10,0,0">
            <Ellipse Width="50" Height="50" Fill="Red" Stroke="Black" StrokeThickness="2"/>
            <TextBlock HorizontalAlignment="Center" Text="{Binding Input, StringFormat=N2}" TextAlignment="Center" Margin="0,10,0,0"/>
            <TextBlock HorizontalAlignment="Center" Text="{Binding Output, StringFormat=N2}" TextAlignment="Center" Margin="0,22,0,0"/>
        </Grid>
    </DataTemplate>

    <DataTemplate x:Key="panel">
        <ScrollViewer VerticalScrollBarVisibility="Auto" Width="70" Margin="100,0,0,0">
            <ItemsControl x:Name="Items" ItemsSource="{Binding Neurons}" ItemTemplate="{StaticResource ellipse}"/>
        </ScrollViewer>
    </DataTemplate>
</UserControl.Resources>
<Grid>
    <ItemsControl x:Name="Panel" ItemsSource="{Binding Layers}" ItemTemplate="{StaticResource panel}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
    </ItemsControl>
</Grid>

我想像这样在神经元之间画线：

所以对于特定层的每个神经元应该有一条线到下一层的每个神经元（把所有的线都画出来会更难理解，所以我没有把所有的线都画在插图上）。我想通过绑定来实现这一点。可能吗？（我不在乎我现有的代码是否需要重构，如果这能解决我的问题。）

注意：我有一个重量对象（一条线代表这个重量）。一个权重对象引用了两个神经元，一个双精度值，即它们与其他一些属性之间的权重。并且可以从用户控件的数据上下文访问权重。

谢谢。

Answer 1

看来 the Nodes Editor example (from the another answer) 应该有所帮助。有必要创建适当的 ViewModel 实例（Node 和 Connector classes）。请注意Node坐标必须在显示前填写（见NodesDataSourceclass的实现）。

对 articles/libraries 的其他引用：

NetworkView: A WPF custom control for visualizing and editing networks, graphs and flow-charts.
Graphviz4Net library：提供能够生成“美观”图形布局的 WPF 控件。
Graph# library：一个图形布局框架，它包含一些布局算法和一个用于WPF应用程序的GraphLayout控件。

用于神经网络可视化的 WPF 控件

WPF control for neural net visualization

c#

wpf

xaml

binding

对 articles/libraries 的其他引用：