手軽にグラフを描いてみた

昔だったら何万も出してグラフパーツを購入したり、むりむり Excel を制御してチャートシートを起こしたりしたんですが。
もっと昔だったら座標とってひとつずつプロットして自力で描いたりしたんですが。

時代はオープンソースで WPF でかなり気合の入ったビジュアルの図表が描き起こせるってほんとですかそうですか。

つことでモノは試しと実際に入手 → 試してみることにしました。
今回使ってみたのは Visifire。英語圏のサイトからの配布ですが、英語読めないことなんか気にしない。

Silverlight & WPF Chart

Download ページへ行って、とりあえず現行最新 v2.2.2 を落としてみました。
ざっと 973KB の zip ファイルで。マニュアルも落として。って説明書きのほうが 5.81MB で。それぞれざっとダウンロードフォルダに展開して。

ダウンロードフォルダのままでは使い勝手がちょいと悪いので、ドキュメントの Visual Studio 2008 フォルダに Components\visifire フォルダを作って、visifire_v2.2.2.zip の bin フォルダの中の 4 ファイルをコピーして。

これで準備完了というかインストール完了というかなんかそんな感じで。


こっから先は、先ほどダウンロードしたマニュアルを見ながらの作業となります。

Visual Studio 2008 IDE で、WPF アプリケーションを新規作成します。マニュアルは C# で解説されていますが、あえて VB で作成します。

次に、WPFVisifire.Charts.dll を参照設定します。
ソリューションエクスプローラからプロジェクト名を右クリック → [参照の追加]をクリックして「参照の追加」ダイアログを表示、[参照]タグで先ほどのフォルダへ → WPFVisifire.Charts.dll を選択して [OK] をクリック。

どうも visifire はコントロールではなく純粋なコンポーネントみたいなので、ツールボックスには何も表示されません。[アイテムの選択...] で追加しようとしても、「ツールボックスに追加できるコンポーネントは何もありません。」とか言われてしまいます。
なので、コードでゴリゴリ書いていくしかなさそうですねー。

まずは Windows1.xaml を少々書き換えます。

<Window x:Class="Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="350" Width="450">
    <Grid x:Name="LayoutRoot">

    </Grid>
</Window>

ウィンドウサイズを少し大きくして、<Grid> に名前を付けただけですが。

で、Windows1.xaml のコード側、Windows1.xaml.vb でコンストラクタを追加。

Public Sub New()

    InitializeComponent()

    '*** Call function to create chart
    Call CreateChart()

End Sub

これも、CreateChart メソッドを呼び出しているだけですが。

最後に、CreateChart メソッドを書きます。

Private Sub CreateChart()

    '*** Create
    Dim _chart As New Visifire.Charts.Chart
    Dim _dataSeries As New Visifire.Charts.DataSeries
    Dim _numberOfDataPoints As Integer = 10
    Dim _random As New System.Random

    '*** Set chart width and height
    _chart.Width = 400 : _chart.Height = 300

    '*** Loop and add a few DataPoints
    For loopIndex As Integer = 0 To _numberOfDataPoints - 1
        Dim _dataPoint As New Visifire.Charts.DataPoint
        _dataPoint.YValue = _random.Next(1, 100)
        _dataSeries.DataPoints.Add(_dataPoint)
    Next

    '*** Add
    _chart.Series.Add(_dataSeries)
    Me.LayoutRoot.Children.Add(_chart)

End Sub

マニュアルの C# コードを VB に焼き直しただけです。
これは簡単に言ってしまえば、乱数 10 個をデータとして Chart インスタンスに割り当てて、xaml の LayoutRoot と名付けた描画空間に組み込んだ、というところですね。

これだけでおしまいです。下が実行結果。

おおぅ、意外と簡単できれいなものが。

コメントを投稿