放大畫布？

Question

嗨，我有一個畫布中的4個圖表控件。當我點擊圖表控件時，它應該相對於控件位置縮放。它的縮放非常完美，但它在畫布外側。

代碼

<Canvas x:Name="SampleCanvas" Background="#F5F7F9" Height="530" Width="1010"> 
        <chartingToolkit:Chart x:Name="mcChart" Loaded="mcChart_Loaded" Width="400" Height="250" Canvas.Left="5" Canvas.Top="5" MouseLeftButtonDown="brdMovable_MouseLeftButtonDown" 
          Background="LightSteelBlue"> 
         <chartingToolkit:Chart.RenderTransform> 
          <ScaleTransform x:Name="scaleTransform"></ScaleTransform> 
         </chartingToolkit:Chart.RenderTransform> 
         <chartingToolkit:Chart.Series> 
          <chartingToolkit:ColumnSeries Title="Experience" IndependentValueBinding="{Binding Path=ModelName}" DependentValueBinding="{Binding Path=SaleCount}"> 
          </chartingToolkit:ColumnSeries> 
         </chartingToolkit:Chart.Series> 
        </chartingToolkit:Chart> 
        <chartingToolkit:Chart x:Name="mcChart2" Loaded="mcChart_Loaded" Width="400" Height="250" Canvas.Left="410" Canvas.Top="5" MouseLeftButtonDown="brdMovable_MouseLeftButtonDown" 
          Background="LightSteelBlue"> 
         <chartingToolkit:Chart.RenderTransform> 
          <ScaleTransform x:Name="scaleTransform2"></ScaleTransform> 
         </chartingToolkit:Chart.RenderTransform> 
         <chartingToolkit:Chart.Series> 
          <chartingToolkit:ColumnSeries Title="Experience2" IndependentValueBinding="{Binding Path=ModelName}" DependentValueBinding="{Binding Path=SaleCount}"> 
          </chartingToolkit:ColumnSeries> 
         </chartingToolkit:Chart.Series> 
        </chartingToolkit:Chart> 
        <chartingToolkit:Chart x:Name="mcChart3" Loaded="mcChart_Loaded" Width="400" Height="250" Canvas.Left="0" Canvas.Top="270" MouseLeftButtonDown="brdMovable_MouseLeftButtonDown" 
          Background="LightSteelBlue"> 
         <chartingToolkit:Chart.RenderTransform> 
          <ScaleTransform x:Name="scaleTransform3"></ScaleTransform> 
         </chartingToolkit:Chart.RenderTransform> 
         <chartingToolkit:Chart.Series> 
          <chartingToolkit:ColumnSeries Title="Experience3" IndependentValueBinding="{Binding Path=ModelName}" DependentValueBinding="{Binding Path=SaleCount}"> 
          </chartingToolkit:ColumnSeries> 
         </chartingToolkit:Chart.Series> 
        </chartingToolkit:Chart> 
        <chartingToolkit:Chart x:Name="mcChart4" Loaded="mcChart_Loaded" Width="400" Height="250" Canvas.Left="410" Canvas.Top="270" MouseLeftButtonDown="brdMovable_MouseLeftButtonDown" 
          Background="LightSteelBlue"> 
         <chartingToolkit:Chart.RenderTransform> 
          <ScaleTransform x:Name="scaleTransform4"></ScaleTransform> 
         </chartingToolkit:Chart.RenderTransform> 
         <chartingToolkit:Chart.Series> 
          <chartingToolkit:ColumnSeries Title="Experience4" IndependentValueBinding="{Binding Path=ModelName}" DependentValueBinding="{Binding Path=SaleCount}"> 
          </chartingToolkit:ColumnSeries> 
         </chartingToolkit:Chart.Series> 
        </chartingToolkit:Chart> 
       </Canvas> 

在後面的代碼我動態傳遞元素，做變焦如下。

  Storyboard storyBoard = new Storyboard(); 

      ///////// X Transform 
      DoubleAnimation ds = new DoubleAnimation(); 
      storyBoard.Children.Add(ds); 
      ds.From = 1; 
      ds.To = 1.5; 
      ds.Duration = new Duration(TimeSpan.FromSeconds(2)); 
      Storyboard.SetTargetName(ds, "scaleTransform"); 
      Storyboard.SetTargetProperty(ds, new PropertyPath("(ScaleX)")); 

      ////Y Transform 

      DoubleAnimation dsy = new DoubleAnimation(); 
      storyBoard.Children.Add(dsy); 
      dsy.From = 1; 
      dsy.To = 1.5; 
      dsy.Duration = new Duration(TimeSpan.FromSeconds(2)); 
      Storyboard.SetTargetName(dsy, "scaleTransform"); 
      Storyboard.SetTargetProperty(dsy, new PropertyPath("(ScaleY)")); 
      LayoutRoot.Resources.Remove("unique_id"); 
      LayoutRoot.Resources.Add("unique_id",storyBoard); 

      storyBoard.Begin(); 

我正在畫布chart2，cahrt3，chart4外的變焦。

有無論如何獲得畫布的縮放中心或圖表的相對位置嗎？

感謝

Answer 1

添加RenderTransformOrigin="0.5,0.5"你是縮放的元素。

例如

<Canvas x:Name="SampleCanvas" RenderTransformOrigin="0.5,0.5"... 

在渲染變換原點共ordindates是大小的分數所以0.5,0.5是中間。