Keyboard usage with TeeChart?

[Agrilink]

Can the cursor on a chart be keyboard driven, i.e by using the arrow keys for example to move the cursor a specified increment?

Or alternatively, clicking a button to move the cursor?

Thanks in advance.

[Narcís]

Hi Agrilink,

By default, the arrow keys are not handled by a control's key processing code, but instead are filtered out for focus management. Hence, the control's KeyDown, KeyUp and KeyPressed events are not hit when you press an arrow. If you want your control to handle these keyboard events, you tell the framework by overriding your control's IsInputKey method.

To achieve that you should create your custom TeeChart class by doing something like this:

Code: Select all

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Text;
using System.Windows.Forms;

namespace KeyboardCursor
{

  public partial class Form1 : Form
  {
    private MyTChart tChart1;
    private Steema.TeeChart.Styles.Line line1;
    private Steema.TeeChart.Tools.CursorTool cursorTool1;

    public Form1()
    {
      InitializeComponent();

      this.tChart1 = new MyTChart();
      this.tChart1.Parent = this;
      this.tChart1.Aspect.View3D = false;
      
      this.line1 = new Steema.TeeChart.Styles.Line();
      this.tChart1.Series.Add(this.line1);            

      tChart1.KeyDown+=new KeyEventHandler(tChart1_KeyDown);

      this.cursorTool1 = new Steema.TeeChart.Tools.CursorTool();
      this.cursorTool1.Style = Steema.TeeChart.Tools.CursorToolStyles.Both;
      this.cursorTool1.FollowMouse = true;
      this.cursorTool1.Series = this.line1;
      this.tChart1.Tools.Add(this.cursorTool1);
    }

    private void Form1_Load(object sender, EventArgs e)
    {
      line1.FillSampleValues();
      cursorTool1.XValue = line1.MinXValue();
      cursorTool1.YValue = line1.MinYValue();
    }

    private void tChart1_KeyDown(object sender, KeyEventArgs e)
    {
      Cursor c = tChart1.Cursor;

      switch (e.KeyCode)
      {
        case Keys.Down:
          cursorTool1.YValue -= 1;
          break;
        case Keys.Up:
          cursorTool1.YValue += 1;
          break;
        case Keys.Left:
          cursorTool1.XValue -= 1;
          break;
        case Keys.Right:
          cursorTool1.XValue += 1;
          break;
        default: break;
      }
      Cursor.Current = c;
    }
  }

  public class MyTChart : Steema.TeeChart.TChart
  {
    protected override bool IsInputKey(Keys key)
    {
      switch (key)
      {
        case Keys.Up:
        case Keys.Down:
        case Keys.Right:
        case Keys.Left:
          return true;
      }
      return base.IsInputKey(key);
    }
  }
}

[Agrilink]

Hi Narcis,

Thanks for the code, it works fine.

One problem I've encountered though. On my form I have checkboxes in a panel. When the checkboxes aren't enabled the arrow keys move the cursor, however when the checkboxes are enabled, the keydown event doesn't seem to fire.

In addition, if I don't have the checkboxes in a panel the code works fine with the checkboxes enabled.

However, I need to have the checkboxes enabled and I need them in a panel as I'm docking them to the bottom of the form, and I'm docking the chart to fill the top of the form.

Any ideas.

Thanks again.

[Narcís]

Hi Agrilink,

This is because the chart is not focused. To solve this you need to click the chart to focus it or give the chart the focus in the MouseEnter and MouseLeave events:

Code: Select all

      //...
      this.cursorTool1 = new Steema.TeeChart.Tools.CursorTool();
      this.cursorTool1.Style = Steema.TeeChart.Tools.CursorToolStyles.Both;
      this.cursorTool1.FollowMouse = true;
      this.cursorTool1.Series = this.line1;
      this.tChart1.Tools.Add(this.cursorTool1);

      tChart1.MouseEnter += new EventHandler(tChart1_MouseEnter);
      tChart1.MouseLeave += new EventHandler(tChart1_MouseLeave);
    }

    void tChart1_MouseLeave(object sender, EventArgs e)
    {
      this.checkBox1.Focus();
    }

    void tChart1_MouseEnter(object sender, EventArgs e)
    {
      tChart1.Focus();
    }

[Agrilink]

Thanks Narcis,

That works perfectly. However simply clicking on the chart doesn't work, I had already tried that.

I needed to add the MouseEnter and MouseLeave events.

Thanks for your help.

[Narcís]

Hi Agrilink,

However simply clicking on the chart doesn't work, I had already
tried that.

It works for me using our latest TeeChart for .NET v2 sources and Visual Studio .NET 2005. Maybe this combination makes the difference. Anyhow I'm glad to hear it works fine for you now.

[Agrilink]

Hi Narcis,

When using this custom TeeChart class, when the chart is drawn it puts lines at the top and to the right of the chart joining the left and bottom axes.

I'm creating an instance of the class at runtime. When using the standard TeeChart (on my form at design time) it doesn't add these lines.

Are there properties I can set to remove these lines?

Thanks a lot.

[Narcís]

Hi Agrilink,

Have you tried hidding the chart walls using the code below?

Code: Select all

      this.tChart1.Walls.Visible = false;

[Agrilink]

Hi Narcis,

Uh duh!

I forgot I was setting that property at design time before using the custom TeeChart class.

Thanks.