WPFのキャンバスに軸を追加する

Question

こんにちは、私は単純な要件があります。私はPolyLineのカップルをXY軸上に表示する作業を行っています。これはどの画面でもうまくスケーリングされ、あらゆる範囲のデータを表示できます。

私はPloyLinesを作成し、その時点でスクリーンサイズと最大値を使用してスケーリング変換を追加しました。基本的には直線XAML-は、単純化のために追加

、複雑な方程式曲線でき

<Polyline Name="Line45" Points="0,0 1,1 2,2 3,3 4,4 5,5 6,6 7,7 8,8 9,9 10,10 11,11 12,12 13,13 14,14 15,15 16,16 17,17 18,18 19,19 20,20 " 
       Stroke="Blue" StrokeThickness="10"> 
      <Polyline.LayoutTransform> 
       <ScaleTransform ScaleY="{Binding ScaleY,Mode=TwoWay}" ScaleX="{Binding ScaleX,Mode=TwoWay}"/> 
      </Polyline.LayoutTransform> 
     </Polyline> 

コード

private void Canvas_SizeChanged(object sender, SizeChangedEventArgs e) 
     { 
      vm.ScaleCanvas(e.NewSize, e.PreviousSize); 
     } 

とViewModelに

public void ScaleCanvas(Size thisNewSize, Size thisOldSize) 
     { 
      NewSize = thisNewSize; 
      ScaleY = thisNewSize.Height/MaxLimitY; 
      ScaleX = thisNewSize.Width/MaxLimitX; 
     } 

の後ろに今私の要件は、にあります私は0からMaxLimitXと0からプロットできるように動的にXY軸をスケーリングするMaxLimitY。

私は考え方がありません。どんなアイディアも参考になります。前もって感謝します。

Answer 1

私は1つの解決策を考えることができます。

• 2列のグリッドを作成します。
• 第1グリッドには垂直方向のスライダがあります。
• 2番目のグリッドはスタックパネルで構成されます。一番上には 「ポリライン」があり、その下に別のスライダーがあります。

サンプル・コードは、ここでは保留されているこの唯一のものは、あなたの好みごとにスライダーをスタイリングし、独自のカスタムTickBar

を追加した後

<Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition/> 
       <ColumnDefinition/> 
      </Grid.ColumnDefinitions> 
     <Slider Orientation="Vertical" Margin="0,0,0,20" 
       Maximum="10" Minimum="1" Width="Auto" 
        AutoToolTipPrecision="2" AutoToolTipPlacement="TopLeft" 
        TickPlacement="TopLeft" 
        Ticks="0.5, 1.5, 2.5, 3.5, 4.5, 5.5, 6.5, 7.5, 8.5, 9.5" 
        IsSelectionRangeEnabled="true" /> 

       <StackPanel Grid.Column="2"> 
     <Polyline Points="0,0 301,301" Stroke="Blue" StrokeThickness="10"> 
      <Polyline.LayoutTransform> 
       <ScaleTransform ScaleY="{Binding ScaleY,Mode=TwoWay}" ScaleX="{Binding ScaleX,Mode=TwoWay}"/> 
      </Polyline.LayoutTransform> 
     </Polyline> 
      <Slider Margin="0 10" Maximum="10" Minimum="1" Width="Auto" 
        AutoToolTipPrecision="2" AutoToolTipPlacement="BottomRight" 
        TickPlacement="BottomRight" 
        Ticks="0.5, 1.5, 2.5, 3.5, 4.5, 5.5, 6.5, 7.5, 8.5, 9.5" 
        IsSelectionRangeEnabled="true"> 

      </Slider> 

     </StackPanel> 
     </Grid> 

です