Software Siglo XXI

Example 53: Zoom and Panning Demo

This sample will show the Zoom and Panning features available in X/Y charts.

Key aspects of this tutorial:

• Zoom must be enabled using ZoomEnable property.

• You can choose if zoom applies to both axis or only one (ZoomMode property).

• Other useful properties: ZoomFactor, ZoomInterval, ZoomOffsetX, ZoomOffsetY.

• May call to ZoomRestore to restore chart view (reset zoom factor and offset).

• Once zoom is enabled, end user can control Zoom and Pan using mouse (use mousewheel to zoom in/out and click+drag to pan).

• Zoom can also be controlled from the context menu as shown in the image below.

Important:

• Zoom & panning is only available in X/Y charts family by now (X/Y scatter, X/Y line, X/Y spline, ...)

• Zoom will only work correctly if XAxisScale and YAxisScale is set to fixed.

Steps:

1. Create a new Windows application project (C#) and name it Tutorial53_XYZoomAndPan.

2. Add Super 2d/3d Graph Library to the toolbox pallete and drag it to Form1.

3. Copy and paste de following code:

using System.Collections.Generic;

using System.ComponentModel;

using System.Data;

using System.Drawing;

using System.Text;

using System.Windows.Forms;

using Super2d3dGraphLibrary;

namespace Tutorial53_XYZoomAndPan

{

public partial class Form1 : Form

{

  public Form1()

  private void Form1_Load(object sender, EventArgs e)

  {

    // setup chart

    super2d3dGraph1.Style = STYLE2D3D.STYLE2D_XY_SPLINE;

    super2d3dGraph1.Title = "Zoom and Pan demo";

    super2d3dGraph1.ShowValues = false;

    super2d3dGraph1.ShowDataTable = false;

    super2d3dGraph1.SeriesLineStyle = new Pen[] { new Pen(Color.DarkBlue,1)};

    super2d3dGraph1.ShowSurface = false;

    super2d3dGraph1.ShowPoints = false;

    super2d3dGraph1.ShowLegend = false;

    super2d3dGraph1.WallsBackStyle = STYLEWALLBACKGROUND.STYLEWALLBACKGROUND_TRANSPARENT;

    // setup x-axis

    super2d3dGraph1.XAxisScaleMode = SCALEMODE.SCALEMODE_FIXED;

    super2d3dGraph1.XAxisScaleMinimumDateTime = new DateTime(2009,1,1);

    super2d3dGraph1.XAxisScaleMaximumDateTime = new DateTime(2009,12,31);

    super2d3dGraph1.ShowDividersX = true;

    // setup y-axis

    super2d3dGraph1.YAxisLocation = STYLEYAXISLOCATION.STYLEYAXISLOCATION_BOTH;

    super2d3dGraph1.YAxisScaleMode = SCALEMODE.SCALEMODE_FIXED;

    // enable zoom and panning feature

    super2d3dGraph1.ZoomEnabled = true;

    super2d3dGraph1.ZoomMode = ZOOM_MODE.XAXIS_ONLY;

    // assign random data using SeriesFactory helper class

    SeriesFactory sf = new SeriesFactory();

    Random rnd = new Random();

    for (int k = 0; k < 500; k++)