Question

我无法将数据绑定到Modern UI Chart控件。

我没有使用它创建XAML元素然后绑定到它的常用方法，我的目标是创建元素并在内存中呈现它，然后获取元素的图像。

下面的代码用于创建和添加内容，图像的渲染效果很好。

    void generateGraphImg()
    {
        PieChart pc = new PieChart();
        ObservableCollection<TestClass>  Errors = new ObservableCollection<TestClass>();
        Errors.Add(new TestClass() { Category = "Globalization", Number = 75 });
        Errors.Add(new TestClass() { Category = "Features", Number = 2 });
        Errors.Add(new TestClass() { Category = "ContentTypes", Number = 12 });
        Errors.Add(new TestClass() { Category = "Correctness", Number = 83 });
        Errors.Add(new TestClass() { Category = "Best Practices", Number = 29 });

        ChartSeries Charts = new ChartSeries();
        Charts.SeriesTitle = "Errors";
        Charts.DisplayMember = "Category";
        Charts.ValueMember = "Number";
        Charts.ItemsSource = Errors;
        pc.Series.Add(Charts);

        pc.ChartTitle = "Minimal Pie Chart";
        pc.ChartSubTitle = "Chart with fixed width and height";

        makeImgFromControl(pc, @"C:\Modern UI IMG\img.bmp");
    }
    void makeImgFromControl(UIElement control, string saveTo)
    {
        Viewbox viewbox = new Viewbox();
        viewbox.Child = control; //control to render
        viewbox.Measure(new System.Windows.Size(200, 200));
        viewbox.Arrange(new Rect(0, 0, 200, 200));
        viewbox.UpdateLayout(); //On PiePiece DrawGeometry() happens here
        RenderTargetBitmap render = new RenderTargetBitmap(500,500, 150, 150, PixelFormats.Pbgra32);
        render.Render(viewbox);
        PngBitmapEncoder encoder = new PngBitmapEncoder();
        encoder.Frames.Add(BitmapFrame.Create(render));
        using (Stream s = File.Create(saveTo))
        {
            encoder.Save(s);
        }
    }

数据的绑定不会呈现，但标题和子标题可以解释为什么会有什么想法？

Answer 1

解决方案隐藏在LayoutUpdated中，经过一段时间黑客攻击现在的UI图表的代码。我需要等到才能获得我的img。

    void generateGraphImg()
    {
        PieChart pc = new PieChart();
        pc.LayoutUpdated += pc_LayoutUpdated;
        ObservableCollection<TestClass> Errors = new ObservableCollection<TestClass>();
        Errors.Add(new TestClass() { Category = "Globalization", Number = 75 });
        Errors.Add(new TestClass() { Category = "Features", Number = 2 });
        Errors.Add(new TestClass() { Category = "ContentTypes", Number = 12 });
        Errors.Add(new TestClass() { Category = "Correctness", Number = 83 });
        Errors.Add(new TestClass() { Category = "Best Practices", Number = 29 });

        ChartSeries Charts = new ChartSeries();
        Charts.SeriesTitle = "Errors";
        Charts.DisplayMember = "Category";
        Charts.ValueMember = "Number";
        Charts.ItemsSource = Errors;
        pc.Series.Add(Charts);

        pc.ChartTitle = "Minimal Pie Chart";
        pc.ChartSubTitle = "Chart with fixed width and height";

        makeImgFromControl(pc, @"C:\Modern UI IMG\img.bmp");
    }

    void pc_LayoutUpdated(object sender, EventArgs e)
    {
        RenderTargetBitmap render = new RenderTargetBitmap(500,500, 150, 150, PixelFormats.Pbgra32);
        render.Render(viewbox);
        PngBitmapEncoder encoder = new PngBitmapEncoder();
        encoder.Frames.Add(BitmapFrame.Create(render));
        using (Stream s = File.Create(@"C:\Modern UI IMG\img.bmp"))
        {
            encoder.Save(s);
        }
    }

    Viewbox viewbox;
    void makeImgFromControl(UIElement control, string saveTo)
    {
        viewbox = new Viewbox();
        viewbox.Child = control; //control to render
        viewbox.Measure(new System.Windows.Size(200, 200));
        viewbox.Arrange(new Rect(0, 0, 200, 200));
        viewbox.UpdateLayout();
    }

Answer 2

尝试在添加ItemSource后分配ChartSeries 。所以改变顺序：

Charts.ItemsSource = Errors; pc.Series.Add(Charts);

为：

pc.Series.Add(Charts); Charts.ItemsSource = Errors;

我测试了，这似乎有所作为。不完全确定原因，但图表对象可能仅在接收集合更改通知时更新。

更新：看一下源代码，看起来饼图是由PiePiece控件组成的，它在构造函数中有：

public PiePiece() { ... Loaded += PiePiece_Loaded; } void PiePiece_Loaded(object sender, RoutedEventArgs e) { DrawGeometry(); }

因此它似乎只在实际Loaded时自我绘制。

以编程方式生成数据并将其绑定到Modern UI Chart

2 个答案: