先(http://ooltcloud.sakura.ne.jp/blog/201307/article_15211613.html) のつづき。
　先の例では、グリッドパネルの表示エリア一杯に描画のグラフを表示したので、グラフの拡大縮小と、表示位置の移動を行ってみます。

　まず、描画エリアの Grid を ScrollViewer で囲みます。そして Grid に "View" という名前をつけます。

<ScrollViewer>
    <Grid x:Name="View">
        <Path x:Name="Graph" Data="" Stroke="Red" Stretch="Fill" />
    </Grid>
</ScrollViewer>

　拡大／縮小の指定をどうやって指示するかですが、今回は Slider を使用し ValueChanged イベントで値の変更を知ることとしました。また、拡大縮小の最小値は 0.1, 最大値を 1000 としました。

<Slider x:Name="Zoom" Value="1" Maximum="1000" Minimum="0.1"/>

　次に、ValueChanged イベントを書きます。

　Graph.Data プロパティ (Geometry クラス) の Bounds プロパティに、現在設定している Path の描画領域に関するデータが記録されています。今回は描画領域の高さがほしいので Height プロパティを参照します。
　Slider の Value 値が拡大率なので、前述 Height (=Path データの高さ) と sender.Value (=Slider の Value) を乗算し、その値を Grid の Height (=View.Height) に設定します。

Private Sub Zoom_ValueChanged(sender As Object ...
    View.Height = Graph.Data.Bounds.Height * sender.Value
End Sub

こうすると、スライダーで拡大縮小、スクロールバーで上下位置の移動が可能になります。

・スライダーを操作し拡大
　　
・さらに拡大
　　
・スクロールバーを操作し表示領域を変更