This is a migrated thread and some comments may be shown as answers.

Issues with Pan/Zoom, Tool Tips, Smart Labels, etc.

10 Answers 358 Views

ChartView

This is a migrated thread and some comments may be shown as answers.

10 Answers, 1 is accepted

answered on 04 Jun 2013, 07:45 PM

Here's the code. For this, I have a RadChartView inside a RadPageView. This is the entirety of the code-behind.

I've created 3 random Date/Number series and, according to the documentation I've read. Showing tool tips and Pan and Zoom, should be working.

using System;

using System.Collections.Generic;

using System.ComponentModel;

using System.Data;

using System.Drawing;

using System.Text;

using System.Windows.Forms;

using System.Linq;

using Telerik.WinControls;

using Telerik.WinControls.UI;

using Telerik.Charting;

namespace RadChartTests

{

public partial class frmChart : Telerik.WinControls.UI.RadForm

{

public frmChart()

{

InitializeComponent();

rcvMain.ShowToolTip = true;

rcvMain.Controllers.Add(new ChartTooltipController());

rcvMain.ShowPanZoom = true;

ChartPanZoomController panZoomController = new ChartPanZoomController();

panZoomController.PanZoomMode = ChartPanZoomMode.Horizontal;

rcvMain.Controllers.Add(panZoomController);

//rcvMain.ShowSmartLabels = true;

}

private void rbGo_Click(object sender, EventArgs e)

{

rcvMain.Title = "Test Chart";

DateTimeContinuousAxis axis = new DateTimeContinuousAxis();

axis.MaximumTicks = 10;

axis.PlotMode = AxisPlotMode.BetweenTicks;

axis.LabelFormat = "{0:d}";

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

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

seriess.Add("Series 1");

seriess.Add("Series 2");

seriess.Add("Series 3");

//First pass. Grab all unique field values.

foreach (var series in seriess)

{

var ls = GetLineSeries(axis, series);

rcvMain.Series.Add(ls);

}

rcvMain.Axes[1].Title = "Number";

}

private LineSeries GetLineSeries(DateTimeContinuousAxis axis, string series)

{

List<CategoricalDataPoint> points = new List<CategoricalDataPoint>();

LineSeries ls = new LineSeries();

Random r = new Random();

for (int i = 0; i < 50; i++)

{

double value = r.Next(0,100);

DateTime date = RandomDay(r);

points.Add(new CategoricalDataPoint(value, date));

}

points = points.OrderBy(p => p.Category).ToList();

foreach (var point in points)

{

ls.DataPoints.Add(point);

}

ls.LegendTitle = series;

ls.HorizontalAxis = axis;

ls.HorizontalAxis.Title = "Date";

ls.PointSize = new SizeF(5, 5);

//var vAxis = new LinearAxis();

//vAxis.Title = chartDetail.XAxisTitle;

//ls.VerticalAxis = vAxis;

return ls;

}

DateTime RandomDay(Random r)

{

DateTime start = new DateTime(1995, 1, 1);

int range = (DateTime.Today - start).Days;

return start.AddDays(r.Next(range));

}

answered on 07 Jun 2013, 02:42 PM

Hi Robert,

Thank you for your reply.

I used your sample code on my machine and it worked without any issues. There are some gotchas though. To use the pan and zoom feature you have to do one of two things. You have to use the Ctrl+Mouse Wheel combination or a zoom gesture (on touch enabled screens) to zoom the chart. Once the chart is zoomed you can pan the chart by holding the left mouse button and moving the mouse or by pan gesture on touch devices.

The tooltips do not show because for them to work there must be a valid hit testable object under the mouse. Line series are not hit testable therefore in this case it is more advisable to use a trackball.

I hope this will be useful. Should you have further questions, I would be glad to help.

Regards,
Ivan Petrov
Telerik

RadChart for WinForms is obsolete. Now what?

answered on 03 Jul 2013, 02:02 PM

BugHunt20130701.zip

Hi Erwin,

Thank you for writing.

Lets continue the discussion from your support ticket about this issue in this forum thread, so the community can benefit from it.

The issue in your case appears due incorrect setting of the Axis of the series. In your designer file you set your bar series HorizontalAxis to be LinearAxis and to VerticalAxis to be DateTimeCategoricalAxis:

Copy Code

barSeries1.HorizontalAxis = linearAxis1;

barSeries1.VerticalAxis = dateTimeCategoricalAxis1;

barSeries2.HorizontalAxis = linearAxis1;

barSeries2.VerticalAxis = dateTimeCategoricalAxis1;

But your HorizontalAxis should be DateTimeCategoricalAxis. Consider the following code snippet:

Copy Code

barSeries1.HorizontalAxis = dateTimeCategoricalAxis1;

barSeries1.VerticalAxis = linearAxis1;

barSeries2.HorizontalAxis = dateTimeCategoricalAxis1;

barSeries2.VerticalAxis = linearAxis1;

However, when you add these series to RadChartView it stores their Axis and the Clear method of the series does not remove them:

radChartView1.Series.Clear();

DateTimeCategoricalAxis dateAxis = this.radChartView1.Axes[1] as DateTimeCategoricalAxis;

LinearAxis minutesAxis = this.radChartView1.Axes[0] as LinearAxis;

If the Clear method removes the axis this code in your project will throw the exception.

In order to remove the unused Axis you should use the Purge method of Axes collection. For example:

this.radChartView1.Axes.Purge();

I was able to reproduce the described issue and without RadPageView, so it does not affect the undesired behavior. The issue appears only due incorrectly swapped Axes.

Because your project does not contains any confidential information and the community might need it in order to understand the nature of your case I attached modified version of your demo.

I hope this information helps.

Regards,
Anton
Telerik

TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WINFORMS.
Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
Sign up for Free application insights >>

answered on 03 Jul 2013, 06:47 PM

03-07-2013-20-46-44.png

03-07-2013-20-53-34.png

Hi Anton, to reproduce the designer Bug:

Create New project, choosing the RadControls Windows Forms Template

On the new Form, Insert a RadChartView, Dock it to the Window

Open the Property Builder of the Chart
Chart Type Cartesian
Axis Type Linear & Date Time Categorical
Press OK

//

// radChartView1

//

this.radChartView1.AreaDesign = cartesianArea1;

linearAxis1.AxisType = Telerik.Charting.AxisType.Second;

linearAxis1.IsPrimary = true;

linearAxis1.LabelRotationAngle = 300D;

linearAxis1.MajorStep = 10D;

linearAxis1.Title = "";

dateTimeCategoricalAxis1.DateTimeComponent = Telerik.Charting.DateTimeComponent.Ticks;

dateTimeCategoricalAxis1.IsPrimary = true;

dateTimeCategoricalAxis1.LabelRotationAngle = 300D;

dateTimeCategoricalAxis1.Title = "";

this.radChartView1.Axes.AddRange(new Telerik.WinControls.UI.Axis[] {

linearAxis1,

dateTimeCategoricalAxis1});

this.radChartView1.Dock = System.Windows.Forms.DockStyle.Fill;

this.radChartView1.Location = new System.Drawing.Point(0, 0);

this.radChartView1.Name = "radChartView1";

categoricalDataPoint1.Category = "A";

categoricalDataPoint1.Label = 89D;

categoricalDataPoint1.Value = 89D;

categoricalDataPoint2.Category = "B";

categoricalDataPoint2.Label = 68D;

categoricalDataPoint2.Value = 68D;

categoricalDataPoint3.Category = "C";

categoricalDataPoint3.Label = 50D;

categoricalDataPoint3.Value = 50D;

categoricalDataPoint4.Category = "D";

categoricalDataPoint4.Label = 28D;

categoricalDataPoint4.Value = 28D;

categoricalDataPoint5.Category = "E";

categoricalDataPoint5.Label = 37D;

categoricalDataPoint5.Value = 37D;

barSeries1.DataPoints.AddRange(new Telerik.Charting.DataPoint[] {

categoricalDataPoint1,

categoricalDataPoint2,

categoricalDataPoint3,

categoricalDataPoint4,

categoricalDataPoint5});

barSeries1.HorizontalAxis = linearAxis1;

barSeries1.LabelMode = Telerik.WinControls.UI.BarLabelModes.Top;

barSeries1.LegendTitle = null;

barSeries1.VerticalAxis = dateTimeCategoricalAxis1;

categoricalDataPoint6.Category = "A";

categoricalDataPoint6.Label = 19D;

categoricalDataPoint6.Value = 19D;

categoricalDataPoint7.Category = "B";

categoricalDataPoint7.Label = 53D;

categoricalDataPoint7.Value = 53D;

categoricalDataPoint8.Category = "C";

categoricalDataPoint8.Label = 48D;

categoricalDataPoint8.Value = 48D;

categoricalDataPoint9.Category = "D";

categoricalDataPoint9.Label = 90D;

categoricalDataPoint9.Value = 90D;

categoricalDataPoint10.Category = "E";

categoricalDataPoint10.Label = 71D;

categoricalDataPoint10.Value = 71D;

barSeries2.DataPoints.AddRange(new Telerik.Charting.DataPoint[] {

categoricalDataPoint6,

categoricalDataPoint7,

categoricalDataPoint8,

categoricalDataPoint9,

categoricalDataPoint10});

barSeries2.HorizontalAxis = linearAxis1;

barSeries2.LabelMode = Telerik.WinControls.UI.BarLabelModes.Top;

barSeries2.LegendTitle = null;

barSeries2.VerticalAxis = dateTimeCategoricalAxis1;

this.radChartView1.Series.AddRange(new Telerik.WinControls.UI.ChartSeries[] {

barSeries1,

barSeries2});

this.radChartView1.ShowGrid = false;

this.radChartView1.Size = new System.Drawing.Size(752, 295);

this.radChartView1.TabIndex = 0;

this.radChartView1.Text = "radChartView1";

//

// Form1

/

Even though the categories are shown on the horizontal Axis as expected from the preview, the assignment seems to be wrong in the designer. See screenshot

when I now add

this.radChartView1.ShowPanZoom = true;

in the contstructor of Form1

namespace Bughunt20130703

{

public partial class Form1 : Form

{

public Form1()

{

InitializeComponent();

this.radChartView1.ShowPanZoom = true;

}

The chart now exposes the pan/zoom problem.

The second screenshot shows the chart zoomed in and panned as much to the right as it allows,

unfortunately I cannot add the zipped project here.

answered on 04 Jul 2013, 12:18 PM

Hello Erwin,

Thank you for writing back.

I was able to reproduce the described issue on my side by following your steps. It seems that sometimes the Property Builder of RadCharView sets incorrect types of the Axes which is an issue. That is why I have added this case to our Public Issue Tracking System. You can track its status here: http://www.telerik.com/support/pits.aspx#/public/winforms/15307

Currently, you can use Smart Tag to setup the chart instead Property Builder or you can swap the types in designer file.

I have added 500 Telerik Points to your account for this report.

Please excuse us for the introduced inconvenience. Let me know if you have any additional questions.

Regards,
Anton
Telerik