c#グラフのラベル間隔の変え方

Question

いつも皆さんに教えていただきながらグラフを作成しています。
前回時間軸の表示方法でお世話になりました。
今回はY軸の目盛り間隔の変え方について教えてください。
visualstudioのフォームアプリで作成しています。

コードusing System;
using System.Collections.Generic;
using System.Drawing;
using System.Text;
using System.Windows.Forms;
using System.IO;
using System.Drawing.Imaging;
using System.Windows.Forms.DataVisualization.Charting;

namespace グラフ
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }



        private void button1_Click(object sender, EventArgs e)
        {

            List<string> list = new List<string>();

            //textファイル読み込み
            StreamReader sr = new StreamReader("ファイル名", Encoding.Default);
            while (sr.Peek() >= 0)
            {
                string line = "";

                while ((line = sr.ReadLine()) != null)
                {
                    list.Add(line);
                }
            }
            sr.Close();
            sr.Dispose();


            chart1.Series.Clear();
            chart1.Legends.Clear();
            chart1.ChartAreas.Clear();
            chart1.Hide();

            chart1.ChartAreas.Add(new ChartArea("1"));



            // Seriesの作成
            Series series1 = new Series();
            series1.ChartArea = "1";
            series1.ChartType = SeriesChartType.Line;


            chart1.ChartAreas[0].AxisX.Minimum = DateTime.MinValue.AddHours(8).ToOADate();
            chart1.ChartAreas[0].AxisX.Maximum = DateTime.MinValue.AddHours(17).ToOADate();
            chart1.ChartAreas[0].AxisX.Interval = 1;
            chart1.ChartAreas[0].AxisX.IntervalType = DateTimeIntervalType.Hours;
            chart1.ChartAreas[0].AxisX.IntervalOffsetType = DateTimeIntervalType.Hours;
            chart1.ChartAreas[0].AxisX.LabelStyle.Format = "HH:mm:ss";

            chart1.ChartAreas[0].AxisY.Maximum = 3;
            chart1.ChartAreas[0].AxisY.Minimum = 1;

            chart1.Series.Add(series1);
            chart1.Series[0].ChartType = SeriesChartType.Line;
            chart1.Series[0].XValueType = ChartValueType.Time;
            chart1.Series[0].IsVisibleInLegend = false;
            chart1.Series[0].IsValueShownAsLabel = false;

            foreach (var line in list)
            {

                var xValue = DateTime.Parse("0001/01/01 " + " "+line.Split('\t')[0]);
                var yValue = line.Split('\t')[1];
                var dp = new DataPoint();
                dp.SetValueXY(xValue, yValue);
                dp.IsValueShownAsLabel = false;
                chart1.Series[0].Points.Add(dp);
            }
        }
    }
}

現在Y軸の値を最低が１、最高が３で設定しているのですが、間のラベルを1.2, 2, 2.7と自分の指定した形にしたいのですが、customRavelの使い方がわからず思うように表示する事ができません。
もしかしたらcustomRavelを使うという考え方も間違えてるのかもしれませんが、やり方を教えていただけないでしょうか。
よろしくお願いします。

Comments

[退会済みユーザー]

サンプルをくまなく探したが希望するものが見つからなかったと言ってますか？ (そうだと言われると自分の知識の及ぶ話ではなさそうなので聞いてます)

[hiro0215]

自分の探しかたが悪いのか、具体的なサンプルが書いてあるサイトを見つけられず、DOCS等で概要などを読んだのですが理解ができなかった次第です。

[退会済みユーザー]

サンプルというのは先の質問者さんのスレッド https://teratail.com/questions/230445 の私の回答の画像にあるものですが、認識は合っているでしょうか？

[hiro0215]

前回この画像をいただいた時は、他の質問者様のところに提示してくださってるアドレスでサンプル取得のサイトも見に行ってサンプル取得を試みたのですが、どれをダウンロードしたらよいかわからず諦めてしまい、その結果、いただいた画像のコードからなんとか答えが導き出せないかと試行錯誤していました。
なので、こちらのサンプルの取得方法がわかっていません。申し訳ありません。

[退会済みユーザー]

ダウンロードサイトから何を入手すればよいかとインストール方法は以下の記事を見てください。

Chart Samples
http://surferonwww.info/BlogEngine/post/2016/02/14/chart-samples.aspx

・・・と思ったら、ダウンロードサイトがいつの間にかリンク切れになってました。残念ながら質問者さんがダウンロードサイトを訪れた時ダウンロードしてなければサンプルを入手する手段はなさそうです。

もしその時ダウンロードだけはしていたなら、上記の記事を参考にインストールしてみてください。

[BluOxy]

1.2, 2, 2.7と間隔の例を提示していますが、等間隔ではないのでしょうか。

[BluOxy]

> ラベル間隔
> Y軸の目盛り間隔

ラベル間隔という表現がいまいちわかりません。と思いきや、Y軸の目盛り間隔と書いてあるので、余計わかりませんでした。グリッド線の間隔を指定したいということでしょうか。

[hiro0215]

遅くなり申し訳ありません。
y軸のグリッド線及びラベルを等間隔ではなく上記の間隔で配置したいということです。
よろしくおねがいします。

Answer 1

Chartコントロールは使ったことがないので何か間違いがあるかもしれませんが、それっぽく表示されているように思います。

CustomLabel クラスの使い方がよくわかっていませんが、ラベルの値が中央に来るようにfromPosition・toPositionを選択すればいいみたいです。

• ２を表示したい場合
  new CustomLabel(1.9, 2.1, "2",でもnew CustomLabel(1, 3, "2",でも、中央値が２になればなんでもいいみたいです（しかしnew CustomLabel(2, 2, "2",はダメです）

GridTickTypes.Allにすると普通のグリッド線のようになります。
LabelMarkStyleはよくわかりません。

using System;
using System.IO;
using System.Text;
using System.Windows.Forms;
using System.Windows.Forms.DataVisualization.Charting;

namespace Questions236057
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
            Dammy();
        }

        private void button1_Click(object sender, EventArgs e)
        {
            chart1.Series.Clear();
            chart1.Legends.Clear();
            chart1.ChartAreas.Clear();
            //chart1.Hide();

            chart1.ChartAreas.Add(new ChartArea("1"));

            chart1.ChartAreas[0].AxisX.Minimum = DateTime.MinValue.AddHours(8).ToOADate();
            chart1.ChartAreas[0].AxisX.Maximum = DateTime.MinValue.AddHours(17).ToOADate();
            chart1.ChartAreas[0].AxisX.Interval = 1;
            chart1.ChartAreas[0].AxisX.IntervalType = DateTimeIntervalType.Hours;
            chart1.ChartAreas[0].AxisX.IntervalOffsetType = DateTimeIntervalType.Hours;
            chart1.ChartAreas[0].AxisX.LabelStyle.Format = "HH:mm:ss";

            chart1.ChartAreas[0].AxisY.Maximum = 3;
            chart1.ChartAreas[0].AxisY.Minimum = 1;
            chart1.ChartAreas[0].AxisY.CustomLabels.Add(new CustomLabel(0.9, 1.1, "1", 0, LabelMarkStyle.None, GridTickTypes.All));
            chart1.ChartAreas[0].AxisY.CustomLabels.Add(new CustomLabel(1.1, 1.3, "1.2", 0, LabelMarkStyle.None, GridTickTypes.All));
            chart1.ChartAreas[0].AxisY.CustomLabels.Add(new CustomLabel(1.9, 2.1, "2", 0, LabelMarkStyle.None, GridTickTypes.All));
            chart1.ChartAreas[0].AxisY.CustomLabels.Add(new CustomLabel(2.6, 2.8, "2.7", 0, LabelMarkStyle.None, GridTickTypes.All));
            chart1.ChartAreas[0].AxisY.CustomLabels.Add(new CustomLabel(2.9, 3.1, "3", 0, LabelMarkStyle.None, GridTickTypes.All));

            //位置があってるか検証用コード
            //chart1.ChartAreas[0].AxisY2.Maximum = 3;
            //chart1.ChartAreas[0].AxisY2.Minimum = 1;
            //chart1.ChartAreas[0].AxisY2.Interval = 0.1;
            //chart1.ChartAreas[0].AxisY2.Enabled = AxisEnabled.True;


            var series1 = new Series
            {
                ChartArea = "1",
                ChartType = SeriesChartType.Line,
                XValueType = ChartValueType.Time,
                IsVisibleInLegend = false,
                IsValueShownAsLabel = false,
            };
            chart1.Series.Add(series1);

            var list = File.ReadAllLines("test.tsv");
            foreach(var line in list)
            {
                var xValue = DateTime.Parse("0001/01/01 " + line.Split('\t')[0]);
                var yValue = line.Split('\t')[1];
                var dp = new DataPoint();
                dp.SetValueXY(xValue, yValue);
                dp.IsValueShownAsLabel = false;
                chart1.Series[0].Points.Add(dp);
            }
        }

        private void Dammy()
        {
            var r = new Random();
            var sb = new StringBuilder();
            var d = DateTime.MinValue.AddHours(8);
            while(true)
            {
                d += TimeSpan.FromSeconds(r.Next(60, 600));
                if(17 <= d.Hour) break;
                sb.Append(d.ToString("HH:mm:ss"));
                sb.Append("\t");
                sb.AppendLine((r.NextDouble() + 1.5).ToString("0.00"));
            }

            File.WriteAllText("test.tsv", sb.ToString());
        }
    }
}

Comments

[hiro0215]

カスタムラベルとはこう使うのですね
GridTickTypesを変えるとラベルだけにしたりグリッド線だけにしたりできそうですね。
一番理想の形だったのでBAとさせていただきました。

Answer 2

float[] yValues = { 1.2f, 2.0f, 2.7f };
foreach (var value in yValues)
{
    StripLine stlipLine = new StripLine
    {
        Text = $"{value}",
        TextAlignment = StringAlignment.Near, 
        TextLineAlignment = StringAlignment.Far,
        Interval = 0,
        IntervalOffset = value,
        BorderWidth = 1,
        BorderColor = Color.Blue,
    };
    chart1.ChartAreas[0].AxisY.StripLines.Add(stlipLine);
}

このようにStripLineで下図のような状態にはできます。

Comments

[hiro0215]

このような方法があったのですね。
ありがとうございます。

もう一点質問なのですが、このラベル(1.2等)を枠の外に出すことは可能でしょうか？
よろしくお願いします。

[YAmaGNZ]

StripLineでは出来ないと思います。
もし、Y軸の左側に描画するのであれば、PrePaintイベントで自分で描画する方法になるのではないかと思います。

Answer 3

Y軸の目盛り間隔の変え方について教えてください。

Axis.Interval プロパティを使うことで目盛りの間隔≒グリッド線の間隔を決めることができます。

chart1.ChartAreas[0].AxisY.Interval = 0.8;

表示の差異

追記に対する回答

y軸のグリッド線及びラベルを等間隔ではなく上記の間隔で配置したい

グリッドの間隔を任意に設定するためのプロパティが見つからないため、用意されていなければ既存のChartAreaでは実装できません。

等間隔に設定できるよう設計を変えるか、カスタムのコントロールを作る必要があると思います。

Comments

[hiro0215]

調べてみたのですが、自分の調べ方が悪いのかchartのカスタムコントロールの設定方法や使い方を見つける事ができませんでした・・・。
もしよろしければ詳しく教えていただくことはできないでしょうか？

[BluOxy]

カスタムコントロールを作るのは覚えたり作ったりする手間が大きいので、YAmaGNZさんの案を採用してください。