How do I correctly update my chart values? (In real time)

Question

I recently encountered a tool called LiveChart and decided to test it out.

Unfortunately I've been having some problems figuring out how to update the chart values in real time. I'm pretty sure there's a clean and correct way of doing it, but I can't seam to find it.

I would like to be able to update the values through a private void or button.

In my code I'm testing it out with a ToolStripMenu.

[CODE]:

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;
using LiveCharts;
using LiveCharts.WinForms;
using LiveCharts.Wpf;
using PokeShowdown_AccStats_T.Properties;
using LiveCharts.Defaults;

namespace PokeShowdown_AccStats_T
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();

            //int val1 = int.Parse(Settings.Default.Value1);

            var value1 = new ObservableValue(3);
            var value2 = new ObservableValue(7);
            var value3 = new ObservableValue(10);
            var value4 = new ObservableValue(2);

            //value1.Value = 5;

            cartesianChart1.Series.Add(new LineSeries 
            {
                Values = new ChartValues<ObservableValue> { value1, value2, value3, value4 },
                StrokeThickness = 4,
                StrokeDashArray = new System.Windows.Media.DoubleCollection(20),
                Stroke = new System.Windows.Media.SolidColorBrush(System.Windows.Media.Color.FromRgb(107, 185, 69)),
                Fill = System.Windows.Media.Brushes.Transparent,
                LineSmoothness = 0,
                PointGeometry = null
            });



            cartesianChart1.Background = new System.Windows.Media.SolidColorBrush(System.Windows.Media.Color.FromRgb(34, 46, 49));

            cartesianChart1.AxisX.Add(new Axis
            {
                IsMerged = true,
                Separator = new Separator
                {
                    StrokeThickness = 1,
                    StrokeDashArray = new System.Windows.Media.DoubleCollection(2),
                    Stroke = new System.Windows.Media.SolidColorBrush(System.Windows.Media.Color.FromRgb(64, 79, 86))
                }
            });
            cartesianChart1.AxisY.Add(new Axis
            {
                IsMerged = true,
                Separator = new Separator
                {
                    StrokeThickness = 1.5,
                    StrokeDashArray = new System.Windows.Media.DoubleCollection(4),
                    Stroke = new System.Windows.Media.SolidColorBrush(System.Windows.Media.Color.FromRgb(64, 79, 86))
                }
            });
        }

        private void Form1_Load(object sender, EventArgs e)
        {

        }

        private void changeValue1ToolStripMenuItem_Click(object sender, EventArgs e)
        {
            Settings.Default.Value1 = "10";
            Settings.Default.Save();
            this.Text = Settings.Default.Value1;

        }

        private void changeValue1To3ToolStripMenuItem_Click(object sender, EventArgs e)
        {
            Settings.Default.Value1 = "3";
            Settings.Default.Save();
            this.Text = Settings.Default.Value1;

        }
    }
}

Solution 1

Live-Charts tries to keep it simple. The logic is to use a generic collection with the type you need to plot, and then as easy as adding/removing or updating any element in this collection then your chart will be updated.

To answer your question, you normally need to:

public partial class Form1 : Form
{
    private ObservableValue value1;

    public Form1()
    {
        InitializeComponent();

        //int val1 = int.Parse(Settings.Default.Value1);

        value1 = new ObservableValue(3);
        //...

        cartesianChart1.Series.Add(new LineSeries 
        {
            Values = new ChartValues<ObservableValue> { value1, ... },
        });
    }

    private void changeValue1ToolStripMenuItem_Click(object sender, EventArgs e)
    {
        value1.Value = 10;
        Settings.Default.Value1 = "10";
        Settings.Default.Save();
        this.Text = Settings.Default.Value1;

    }
}

Then the library will handle animations and the update

Solution 2

Note: The question is about LiveCharts. But this answer is posted based on MSChart. To see the answer about LiveCharts see other answer.

Chart supports data-binding. Use data-binding and update data source then refresh chart. For example:

DataTable table = new DataTable();
Random random = new Random();
private void Form1_Load(object sender, EventArgs e)
{
    table.Columns.Add("X", typeof(int));
    table.Columns.Add("Y", typeof(int));
    for (int i = 0; i < 10; i++)
        table.Rows.Add(i+1, random.Next(100));
    chart1.Series[0].ChartType = 
        System.Windows.Forms.DataVisualization.Charting.SeriesChartType.Column;
    chart1.Series[0].XValueMember = "X";
    chart1.Series[0].YValueMembers = "Y";
    chart1.DataSource = table;
    chart1.ChartAreas[0].AxisX.Interval = 1;
    chart1.ChartAreas[0].AxisX.Minimum = 0;
    chart1.ChartAreas[0].AxisX.Maximum = 10;
    chart1.ChartAreas[0].AxisY.Interval = 10;
    chart1.ChartAreas[0].AxisY.Minimum = 0;
    chart1.ChartAreas[0].AxisY.Maximum = 100;
    chart1.DataBind();
    var timer = new Timer() { Interval= 300};
    timer.Tick += timer_Tick;
    timer.Start();
}
void timer_Tick(object sender, EventArgs e)
{
    for (int i = 0; i < 10; i++)
        table.Rows[i][1]= random.Next(100);
    chart1.DataBind();
}

Comments

[bto.rdz]

This is not what the OP is asking, he is asking abut Live-Charts

[Reza Aghaei]

@bto.rdz It seems I missed and mistakenly removed livecharts tag in edit. Yes the question is about livecharts.

[Reza Aghaei]

@bto Also you/other anyone who downvoted the answer don't need donwvote an answer just to fade it. This post will be useful for future readers who wants to do the trick using mschart. You can post a good answer instead, no need to fade other answers.

[bto.rdz]

Sorry, I wanted to remove the down vote, but it was too late, I know your answer is also helpful

[Reza Aghaei]

@bto.rdz No problem. I edited the answer and you can do it now.