在 MVVM WPF 的上下文中使用 EmguCV 显示图像直方图

Question

我不确定如何获取直方图图表并使用 MVVM 显示它。我找到了一个答案，虽然很简单，但它不符合我目前拥有并希望保留的 MVVM 设计模式： How to draw histogram using EmguCV and C#

不太确定如何使用 MVVM 显示此 histogramBox 控件。如果有合适的解决方案而不是使表单在 MVVM 中显示的解决方法，我会很高兴，如果没有，解决方法也会这样做。

我可以将直方图作为图像获取吗？并将其显示为图像吗？（我可以在 MVVM 中处理）。

Answer 1

为了正确使用 mvvm，您需要获取 直方图作为值数组，您将在图表中显示它。下面是一个如何计算直方图的例子：How to draw histogram using EmguCV and C#

将数组公开为视图模型 的属性。在 xaml 中，使用带有自定义 ItemTemplate 和 PanelTemplate 的 ItemsControl 来显示图表。将 ItemsSource 数据绑定到数组。在 ItemTemplate 中，您可以将 具有高度数据的矩形 绑定到直方图值。这样做的好处是您可以在 xaml 中定义图表的视觉外观，您可以添加一些用户交互，并且您的布局可以在调整大小时响应。

如果您需要 xaml 方面的帮助，请告诉我。

编辑： 这是纯 xaml.

中承诺的图表示例

视图模型：

public class MainWindowViewModel
{
    public MainWindowViewModel()
    {
        ChartValues = Enumerable.Range(1, 10) //replace this with your histogram
            .Select(i => (float) i*i)
            .ToArray();
    }

    public float[] ChartValues { get; set; }
}

查看：

<ItemsControl ItemsSource="{Binding ChartValues}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Horizontal" />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Rectangle Height="{Binding }" Width="10" VerticalAlignment="Bottom"
                       Fill="#eee" Stroke="Gray" Margin="-1.0"/>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

结果：

在 MVVM WPF 的上下文中使用 EmguCV 显示图像直方图

Display Image Histogram using EmguCV in the context of MVVM WPF

c#

wpf

mvvm

emgucv