創建WriteableBitmap表單圖表問題

Question

嘗試創建可寫入的位圖表單Silverlight工具箱圖表時出現問題。

當使用文本塊，一切都很好，但試圖用圖表後，生成位圖是空的:(。

var data = new List<Point>(100); 
for (int i = 0; i < 100; i++) 
{ 
    data.Add(new Point(i, Math.Sin(i * Math.PI/50))); 
} 

Chart chart_ = new Chart() 
{ 
    Name = "Chart", 
    Width = 512, 
    Height = 512 
}; 
LineSeries line = new LineSeries() 
{ 
    Name = "Line", 
    Title = "test", 
    IndependentValuePath = "X", 
    DependentValuePath = "Y", 
    ItemsSource = data 
}; 
chart_.Series.Add(line); 

此代碼創建表與它的正弦曲線。然後我試着用它創建位圖。

LayoutRoot.Children.Add(chart_); // I tried to add chart_ to visual tree, It doesn't help 
//creates bitmap 
ScaleTransform t = new ScaleTransform() { ScaleX = 1.0, ScaleY = 1.0 }; 
//bitmap = new WriteableBitmap(chart_, t); Tried it also with this way 
bitmap = new WriteableBitmap(512, 512); 
bitmap.Render(chart_, t); 
texture = new Texture2D(GraphicsDeviceManager.Current.GraphicsDevice, bitmap.PixelWidth, bitmap.PixelHeight, false, SurfaceFormat.Color); 
bitmap.CopyTo(texture); 

所有這些代碼創建空Bitmap.But當我使用的TextBlock或一些類似的圖元橢圓，一切正常。我確信，該​​代碼生成的圖表是罰款，原因是生成的圖表在Silverlight控件的罰款。

編輯： 我試圖以這種方式創建位圖，但它不幫助。

chart_.InvalidateMeasure(); 
bitmap = new WriteableBitmap(512, 512); 
bitmap.Render(chart_, null); 
bitmap.Invalidate(); 

編輯2： 我不想圖表是在視覺樹。我只需要生成它的圖像，而不是在我的應用程序的XNA部分中使用它。

Answer 1

只是一些小的改變，但我懷疑是在使用NuGet添加Charting軟件包後，手動添加對System.Windows.Controls的引用。

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Net; 
using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Documents; 
using System.Windows.Input; 
using System.Windows.Media; 
using System.Windows.Media.Animation; 
using System.Windows.Shapes; 
using System.Windows.Controls.DataVisualization.Charting; 
using System.Windows.Media.Imaging; 

namespace SilverlightApplication1 
{ 
    public partial class MainPage : UserControl 
    { 
     Chart chart_; 

     public MainPage() 
     { 
      InitializeComponent(); 

      var data = new List<Point>(100); 
      for (int i = 0; i < 100; i++) 
      { 
       data.Add(new Point(i, Math.Sin(i * Math.PI/50))); 
      } 

      chart_ = new Chart() 
      { 
       Name = "Chart", 
       Width = 512, 
       Height = 512 
      }; 
      LineSeries line = new LineSeries() 
      { 
       Name = "Line", 
       Title = "test", 
       IndependentValuePath = "X", 
       DependentValuePath = "Y", 
       ItemsSource = data 
      }; 
      chart_.Series.Add(line); 
      LayoutRoot.Children.Add(chart_); // I tried to add chart_ to visual tree, It doesn't help 
     } 

     private void LayoutRoot_Loaded(object sender, RoutedEventArgs e) 
     { 
      //creates bitmap 
      WriteableBitmap bitmap; 
      ScaleTransform t = new ScaleTransform() { ScaleX = 1.0, ScaleY = 1.0 }; 
      //bitmap = new WriteableBitmap(chart_, t); Tried it also with this way 
      bitmap = new WriteableBitmap(512, 512); 
      bitmap.Render(chart_, t); 
      //texture = new Texture2D(GraphicsDeviceManager.Current.GraphicsDevice, bitmap.PixelWidth, bitmap.PixelHeight, false, SurfaceFormat.Color); 
      //bitmap.CopyTo(texture); 
      image1.Source = bitmap; 
     } 
    } 
} 

而且

<UserControl x:Class="SilverlightApplication1.MainPage" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d" 
    d:DesignHeight="300" d:DesignWidth="400" 
    xmlns:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit"> 

    <Grid x:Name="LayoutRoot" Background="White" Loaded="LayoutRoot_Loaded"> 
     <Image Height="150" HorizontalAlignment="Left" Margin="97,109,0,0" Name="image1" Stretch="Fill" VerticalAlignment="Top" Width="200" /> 
    </Grid> 
</UserControl> 

這應該讓你去...

不要忘記刪除所有試圖解決方法 - 我不認爲任何人都需要的。我沒有從你的例子使用的唯一的代碼曾與紋理做 - 我不知道如何處理做，大衛

這不是你反正有問題...

Answer 2

我相信當你創建WriteableBitmap對象&時，調用Render方法，Chart還沒有被渲染。您可以通過將這些代碼行移動到Button_Click等其他事件來檢查此問題。查看下面的代碼，因爲它正在創建WriteableBitmap，然後將其作爲源傳遞給圖像控件。 ....

<UserControl x:Class="TryBitmap.MainPage" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
mc:Ignorable="d" 
d:DesignHeight="300" d:DesignWidth="400" 
xmlns:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit"> 
<Grid x:Name="LayoutRoot" Background="White"> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="35"/> 
     <RowDefinition/> 
    </Grid.RowDefinitions> 
    <Button Grid.Row="0" Height="25" Width="100" Content="Capture" Click="Button_Click"/> 
    <Grid x:Name="grdGraphs" Grid.Row="1"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition/> 
      <ColumnDefinition/> 
     </Grid.ColumnDefinitions> 
     <Image x:Name="img" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
    </Grid> 
</Grid> 

代碼隱藏....

public partial class MainPage : UserControl 
{ 
    private Chart chart_; 

    public MainPage() 
    { 
     InitializeComponent(); 
     Loaded += new RoutedEventHandler(MainPage_Loaded); 
    } 

    void MainPage_Loaded(object sender, RoutedEventArgs e) 
    { 
     var data = new List<Point>(100); 
     for (int i = 0; i < 100; i++) 
     { 
      data.Add(new Point(i, Math.Sin(i * Math.PI/50))); 
     } 

     chart_ = new Chart() 
     { 
      Name = "Chart", 
      Width = 512, 
      Height = 512 
     }; 
     LineSeries line = new LineSeries() 
     { 
      Name = "Line", 
      Title = "test", 
      IndependentValuePath = "X", 
      DependentValuePath = "Y", 
      ItemsSource = data 
     }; 
     chart_.Series.Add(line); 

     chart_.SetValue(Grid.ColumnProperty, 0); 
     grdGraphs.Children.Add(chart_); 
    } 

    private void Button_Click(object sender, RoutedEventArgs e) 
    { 
     var bitmap = new WriteableBitmap((int)(chart_.RenderSize.Width), (int)(chart_.RenderSize.Height)); 
     bitmap.Render(chart_, new MatrixTransform()); 
     bitmap.Invalidate(); 

     img.Source = bitmap; 
    } 
} 

Answer 3

這恐怕只會是半答案。我可以解決你眼前的問題，但是恐怕你只會得到另一個我沒有設法解決的問題。

創建於Dispatcher.BeginInvoke通話結束後，位圖應該確保你的位圖不完全是黑屏，即：

// do stuff with chart_ ... 

Dispatcher.BeginInvoke(() => 
{ 
    bitmap = new WriteableBitmap(512, 512); 
    bitmap.Render(chart_, null); 
    bitmap.Invalidate(); 

    // At this point, the bitmap shouldn't be blank. 
}); 

然而，這很可能的結果是不盡如人意。我運行了代碼，發現圖表圖像中缺少LineSeries，儘管圖表的其餘部分在那裏。即使我設置的所有Duration S上的各種動畫在ControlTemplate爲LineSeries 0這仍然是真實，另外設置圖表上的以下屬性：

chart_.AnimationSequence = AnimationSequence.Simultaneous; 
    chart_.TransitionDuration = new TimeSpan(0); 

我試圖進一步呼籲包裹WriteableBitmap的操作Dispatcher.BeginInvoke() ，這樣做後，數據點開始變得更清晰。然而，我不相信像這樣的方法是解決問題的正確方法。