C# PR

【質問回答】ScottPlot 4.1.58でグラフをリアルタイムに表示する方法 (凡例付き)

記事内に商品プロモーションを含む場合があります

はじめに

ScottPlotのVer.4.1.58でグラフ(ScatterPlot)をリアルタイムに描画する方法を解説します。

リアルタイムでの描画方法は以前の記事でも解説していますが、Ver.4.1系のバージョンアップの途中で表示用のリストの扱いが変わりました。

同様に、凡例も変わっていて解決できずにいたのですが、コメントにて使い方を教えていただいたので、記事にまとめたいと思います。

質問いただいた「暁」さん、表示方法を教えていただいた「りゅーいち」さん、ありがとうございます。

環境

この記事は以下の環境で作成しています。

環境 バージョン 備考
VisualStudio 2019
.NET Framework 4.7.2
ScottPlot 4.1.58
Windows 11 10でもOKです。

楽天ブックス
¥2,139 (2023/02/03 06:42時点 | 楽天市場調べ)

プログラム概要

今回のプログラムの概要は以下の通りです。

  • リアルタイム更新用のリストを取得する。
  • 凡例を設定する
  • リアルタイムにグラフを描画する

実行結果

後述するコードを実行すると、以下のグラフを表示できます。

記事内のコードの(凡例付きリアルタイムグラフの実行結果
凡例付きリアルタイムのグラフ

全体コード

全体コードは以下の通りです。詳細な内容は後述する「コードのポイント」で解説します。

  • デザイナで「fromPlot1」「timer1」を追加してください。
  • timer1のイベントに「timer1_Tick」関数を指定してください。
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;

namespace ScottPlot41_RT_Legend
{
    public partial class Form1 : Form
    {
        // ScottPlotに動的にデータをセットするためのリストです。
        ScottPlot.Plottable.ScatterPlotList<double> pointList = null;

        // Xの値に使います
        double xPosition = 0.0;

        // Yの値(乱数)に使います
        Random random = new System.Random();

        public Form1()
        {
            InitializeComponent();

            // ScottPlotからデータ更新用のリストを取得します。
            pointList = formsPlot1.Plot.AddScatterList<double>();

            // 凡例に表示する文字列をセットします。
            pointList.Label = "凡例";

            // ScottPlotから凡例を設定するためのオブジェクトを取得します。
            ScottPlot.Renderable.Legend legend =  formsPlot1.Plot.Legend();

            // 凡例の設定(フォントサイズ、太字設定) です
            legend.FontSize = 24;
            legend.FontBold = true;

            // タイマーの処理を開始します
            timer1.Start();
        }

        //
        // タイマー処理です
        //
        private void timer1_Tick(object sender, EventArgs e)
        {
            // Yの値用に、乱数を生成します(0~1.0を生成)
            double yPosition = random.NextDouble();

            // データをプロットします
            pointList.Add(xPosition, yPosition);

            // ポイントデータに合わせて表示範囲を自動調整します。
            formsPlot1.Plot.AxisAuto();

            // グラフを描画します
            formsPlot1.Render();

            // 次の周期のためにXの値をプラスします
            xPosition += 1.0;
        }
    }
}

コードのポイント

リアルタイム更新用のリストを取得する

AddScatterListでScottPlotからリアルタイム更新用のリストを取得します。

リストはC#のLinqに対応しており、後述するAdd関数を使ってポイントデータを簡単に追加することができます。

 // ScottPlotからデータ更新用のリストを取得します。
pointList = formsPlot1.Plot.AddScatterList<double>();

凡例を設定する

上記で取得したリストのLabelプロパティに凡例に表示する文字列を設定します。

設定した文字列はLegend関数を呼び出すと、凡例として表示されます。文字列をカスタマイズしたい場合は、同関数の戻り値のオブジェクトを使用してください。

// 凡例に表示する文字列をセットします。
pointList.Label = "凡例";

// ScottPlotから凡例を設定するためのオブジェクトを取得します。
ScottPlot.Renderable.Legend legend =  formsPlot1.Plot.Legend();

// 凡例の設定(フォントサイズ、太字設定) です
legend.FontSize = 24;
legend.FontBold = true;

デフォルト設定で凡例を表示する場合は、Labelを設置して以下のコードでOKです。

formsPlot1.Plot.Legend();

リアルタイムにグラフを描画する

前述したリアルタイム更新用のリストにポイントデータを追加後、Render関数を呼び出すことで、追加したデータをリアルタイム(動的)に描画することが出来ます。

             // データをプロットします
            pointList.Add(xPosition, yPosition);

            // ポイントデータに合わせて表示範囲を自動調整します。
            formsPlot1.Plot.AxisAuto();

            // グラフを描画します
            formsPlot1.Render();

まとめ

ScottPlot Ver.4.1.58でリアルタイムにグラフを描画する方法、凡例を表示・設定する方法について解説しました。

ScottPlotをリアルタイムで使う情報は公式にも少なく、(私も含め)困っている人は多いと思います。今回の記事が困っている人の助けになればうれしいです。

お知らせ

今月号のSoftware Designは「もっとTypeScriptの力を引き出そう」

JavaScriptの拡張言語でしょ?と思っているかたへ、Union型などTypeScriptの持つ秘めたる力を解説する特集となっています。

個人的には第2特集の「Ubuntuの現代的な使い方」がの方が気になりました。より詳しい内容は以下のリンクからご覧ください。

質問・要望 大歓迎です

「こんな解説記事作って」「こんなことがしたいけど、〇〇で困ってる」など、コメント欄で教えてください。 質問・要望に、中の人ができる限り対応します。

使えたよ・設定できたよの一言コメントも大歓迎。気軽に足跡を残してみてください。記事を紹介したい方はブログ、SNSにバシバシ貼ってもらってOKです。

ABOUT ME
えす
現役のソフトウェアエンジニアです。 C++ C# Python を使ってます。10年ちょい設計/開発部門にいましたが、今はQAエンジニアっぽいことをしています。

COMMENT

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

Index