【WPF】いちばんやさしいScottPlot の使い方(WindowsForm共通)

当ページのリンクには広告が含まれています。

フリーのチャートライブラリの中では、高機能且つ高速なのに知名度が低いScottPlot。

初期状態でデザインもそこそこなので、私としては一番のお気に入りです。

ただ、公式サイトのサンプルは充実しているというものの、いずれも具体的なコーディングばかりで、体系的な部分がほとんど解説されていません。

今回は、NuGetによるインストール方法と、基本的な描画手順について解説します。

この記事を読んだ後で公式サイトの CookBook を読んでいただくと、より分かりやすくなると思います。

尚、 2021年5月からVer 4.1 になり、機能が拡張され、記述方法が少し変わっています。本記事は Ver 4.1 で書き直していますが、もし旧バージョンから変更する場合は、その要点を【WPF】ScottPlot Ver 4.1 で楽々グラフ描画!旧Verとの違いも合わせて解説!にまとめていますので、併せてお読みください。

目次

ScottPlotの概要

WPF,WindowsFormの両方をサポートするフリーのチャートライブラリです。

WindowsForm だと標準でChart というコントロールが付属していますが、WPFの場合はチャート用のコントロールが標準で付属していないので、サードパーティのチャートコントロールを使う機会が多くなります。

では、どんなチャートが作成できるのでしょうか。

詳しくは こちら の公式サイトに掲載されていますが、次のようなグラフが簡単に表示できます。

何の変哲もないグラフですが、一般的なチャートライブラリで描画可能な、折れ線グラフ、円グラフ、縦棒グラフ、横棒グラフ、積み上げグラフ、レーダーチャート、散布図、箱ひげ図、ヒートマップに対応しています。

また、他のチャートライブラリであまりサポートされていない機能として、文字列を任意の位置に表示したり、回帰分析による直線の傾きを求めるメソッド標準偏差や平均などの統計情報を求めるメソッドが用意されているのも特徴です。

インストール方法

Nuget から scott で検索して下さい。

Windows Form版とWPF 版がありますので、必要な方をインストールして下さい。

Nugetの使い方に関しては、こちらの記事に記載しています。

使い方

プロジェクトにインストールすると、Visual Studioのツールボックスにコントロールが表示されます。

OxyPlotやLiveChartsなどはツールボックスにコントロールが表示されないので、XAMLでゴリゴリ書かなければなりませんが、ScottPlotはドラッグ&ドロップで張り付けて使用できます。

ScottPlotの構造

ScottPlotは WpfPlot クラスのplt プロパティで取得できる Plot クラスに対して、タイトルやプロットデータ、縦軸横軸の設定などを行います。

そして、最後に WpfPlot クラスの Render メソッドを呼び出すことで、画面に表示されます。

具体的には、次のような手順になります。

まず、Visual Studio のレイアウトエディタで、ScottPlotコントロールをドラッグ&ドロップして、uxChart という名前を付けると、次のようなXAMLになると思います。

uxChart コントロールを使って、折れ線グラフを描画する場合、C#ソースコードは次の様になります。

最初にタイトルを表示するために Title メソッドを呼んでいます。

次に、AddScatterメソッドにx座標、y座標のデータ (double[])を渡しています。

最後に、Renderメソッドを呼ぶことで、折れ線グラフが画面に表示されます。

簡単ですよね。

複数の折れ線を重ねて描画する場合、AddScatterを複数回呼んで、最後に Render メソッドを呼ぶだけです。

サンプルソース

では、よく使いそうな設定を網羅した簡単なサンプルソースを紹介しておきます。

メソッド化しているので、引数にScottPlot のコントロールを渡してもらえれば、冒頭のチャート画像と同じものが表示されます。

uxChart という名前を付けたと仮定すると、次の方法で呼び出せます。

そうそう、C#ソースコードの参照設定に ScottPlot を記述しておいて下さいね。

以下が、実際のソースコードになります。

それぞれの設定にコメントを入れていますので、どんな設定が可能かがおおよそ分かると思います。

ちょっと気になる点

問題とまでは言いませんが、こう出来ればよいのにと思う点が1点あります。

1つ目は、凡例(Legend)がチャートエリアの外に出せない事です。

私が調べ切れていないだけかもしれませんが、OxyPlotにせよ、LiveCharts にせよ、マイクロソフト標準のChart にせよ、凡例はチャートエリアの外に表示させることができるので、この点はちょっと残念です。

以前のバージョン(4.xx)では、縦軸が左端に寄り過ぎて、すこし端が切れてしまっていましたが、4.1.xx からは改善されているようで、綺麗に表示されています。

まとめ

ソースのコメントを読んでいただければ、どんなことが設定できるのかが分かると思います。

各メソッドには非常に多くの引数を渡すことができるので、全てを解説することが出来ません。

Visual Studioのエディタでメソッドにマウスを当てると使用可能な引数が表示されますので、これを参考に使いこなして頂ければと思います。

どんなチャートが用意されているかを含め、各グラフに関する詳細な情報が公式ページに記載されていますので、そちらを参考にして頂ければと思います。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次