Rank 2
Iron
Iron
Iron
Hi ,
I am having a range bar series. When hovered over a range data point i need to get the plot value and display as a tooltip of that hovered data point. Attached is the sample code , where i need to capture range data point.
private void radChartView1_ToolTipTextNeeded(object sender, Telerik.WinControls.ToolTipTextNeededEventArgs e)
{
RadChartElement element = (RadChartElement)sender;
//RangeDataPoint dataPoint = (RangeDataPoint)element.;//var item = sender as RadChartElement;//if (item != null)//{// var dataItem = item.DataPoint as RangeDataPoint;// e.ToolTipText = dataItem.High.ToString();//}//e.ToolTipText = "Hi";
}
private void LoadBarChart()
{
chart.View.AreaType = ChartAreaType.Cartesian;
chart.AngleTransform = 90;
RangeBarSeries rangeBarSeries = new RangeBarSeries();
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 14, DateTime.Now.TimeOfDay.TotalMinutes + 10, "5/17/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 7, DateTime.Now.TimeOfDay.TotalMinutes + 5, "5/17/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 4, DateTime.Now.TimeOfDay.TotalMinutes + 2, "5/17/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 30, DateTime.Now.TimeOfDay.TotalMinutes + 10, "5/18/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 7, DateTime.Now.TimeOfDay.TotalMinutes + 5, "5/18/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 4, DateTime.Now.TimeOfDay.TotalMinutes + 2, "5/19/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes - 89, DateTime.Now.TimeOfDay.TotalMinutes - 100, "5/20/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 7, DateTime.Now.TimeOfDay.TotalMinutes + 5, "5/20/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes - 79, DateTime.Now.TimeOfDay.TotalMinutes - 90, "5/21/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 7, DateTime.Now.TimeOfDay.TotalMinutes + 5, "5/21/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 14, DateTime.Now.TimeOfDay.TotalMinutes + 10, "5/22/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 7, DateTime.Now.TimeOfDay.TotalMinutes + 5, "5/22/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 14, DateTime.Now.TimeOfDay.TotalMinutes + 10, "5/23/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 7, DateTime.Now.TimeOfDay.TotalMinutes + 5, "5/23/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 14, DateTime.Now.TimeOfDay.TotalMinutes + 10, "5/25/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 7, DateTime.Now.TimeOfDay.TotalMinutes + 5, "5/24/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 14, DateTime.Now.TimeOfDay.TotalMinutes + 10, "5/26/2021"));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(DateTime.Now.TimeOfDay.TotalMinutes + 7, DateTime.Now.TimeOfDay.TotalMinutes + 5, "5/26/2021"));
CategoricalAxis horizontalAxis = new CategoricalAxis();
horizontalAxis.ClipLabels = false;
horizontalAxis.ShowLabels = false;
//horizontalAxis.LabelRotationAngle = -90;//horizontalAxis.LabelFitMode = AxisLabelFitMode.Rotate;
horizontalAxis.PlotMode = AxisPlotMode.BetweenTicks;
rangeBarSeries.HorizontalAxis = horizontalAxis;
chart.View.Series.Add(rangeBarSeries);
chart.View.ShowToolTip = true;
chart.View.ShowTrackBall = true;
ChartTooltipController tooltipController = new ChartTooltipController();
tooltipController.DataPointTooltipTextNeeded += tooltipController_DataPointTooltipTextNeeded;
this.chart.View.Controllers.Add(tooltipController);
rangeBarSeries.VerticalAxis.LabelFormatProvider = new MyFormatProvider();
rangeBarSeries.VerticalAxis.ClipLabels = false;
rangeBarSeries.VerticalAxis.LabelRotationAngle = -45;
rangeBarSeries.VerticalAxis.LabelFitMode = AxisLabelFitMode.Rotate;
LinearAxis verticalAxis = chart.View.Axes.Get<LinearAxis>(1);
verticalAxis.Minimum = 0; //Minutes 0:00
verticalAxis.Maximum = 1380; //Minutes 23:00
verticalAxis.MajorStep = 60; //60 minutes in an hour
}
private void tooltipController_DataPointTooltipTextNeeded(object sender, DataPointTooltipTextNeededEventArgs e)
{
RangeDataPoint dp = e.DataPoint as RangeDataPoint;
if (dp != null)
{
e.Text = dp.High + " " + dp.Low;
}
}
3 Answers, 1 is accepted
Hi,
RadChartView offers the ChartTooltipController for showing tooltips. The DataPointTooltipTextNeeded event that the ChartTooltipController has is a suitable place for changing the precalculated text. More information is available in the following help article:
https://docs.telerik.com/devtools/winforms/controls/chartview/features/tooltip
ChartTooltipController tooltipController = new ChartTooltipController();
tooltipController.DataPointTooltipTextNeeded += tooltipController_DataPointTooltipTextNeeded;
this.radChartView1.Controllers.Add(tooltipController);
private void tooltipController_DataPointTooltipTextNeeded(object sender, DataPointTooltipTextNeededEventArgs e)
{
RangeDataPoint dp = e.DataPoint as RangeDataPoint;
if (dp!=null)
{
e.Text = dp.High + " " + dp.Low;
}
}I would like to note that RadChartView provides a trackball behavior. This controller can display a vertical line across the chart plot area and also to display little visual indicators (circles by default) at points where the trackball line crosses the visualization of a series object. Please refer to the following help article:
https://docs.telerik.com/devtools/winforms/controls/chartview/features/trackball
Feel free to use this approach which suits your requirements best.
I hope this information helps. If you need any further assistance please don't hesitate to contact me.
Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik
Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.
Rank 2
Iron
Iron
Iron
Hello,
I have attached my sample project for your reference. Please give it a try and see how it works on your end. The below screenshot illustrates the observed result on my end:
Am I missing something? Could you please specify the exact steps how to reproduce the problem with the sample project?
I am looking forward to your reply.
Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik
Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.
Rank 2
Iron
Iron
Iron
Rank 2
Iron
Iron
Iron
Hello,
I have reviewed the updated code snippet in your initial post and modified my sample project accordingly.
Indeed, the applied AngelTransform to the chart affects the trackball. The trackball is designed to be moved horizontally according to the horizontal axis. You can rotate tre trackball by using the following custom implementation which result is illustrated in the attached gif file. Note that this is just a sample approach and it may not cover all possible cases. Feel free to modify and extend it in a way which suits your custom requirements best:
public RadForm1()
{
InitializeComponent();
RangeBarSeries rangeBarSeries = new RangeBarSeries();
rangeBarSeries.DataPoints.Add(new RangeDataPoint(10, 7, DateTime.Now.Date));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(6, 3, DateTime.Now.Date));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(8, 5, DateTime.Now.Date.AddDays(1)));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(12, 9, DateTime.Now.Date.AddDays(2)));
rangeBarSeries.DataPoints.Add(new RangeDataPoint(8, 7, DateTime.Now.Date.AddDays(3)));
this.radChartView1.Series.Add(rangeBarSeries);
radChartView1.Controllers.Add(new CustomChartTrackballController());
this.radChartView1.ChartElement.AngleTransform = 90;
}
private void tooltipController_DataPointTooltipTextNeeded(object sender, DataPointTooltipTextNeededEventArgs e)
{
RangeDataPoint dp = e.DataPoint as RangeDataPoint;
if (dp != null)
{
e.Text = dp.High + " " + dp.Low;
}
}
public class CustomChartTrackballController : ChartTrackballController
{
public ViewResult Result
{
get
{
FieldInfo fi = typeof(ChartTrackballController).GetField("result", BindingFlags.Instance | BindingFlags.NonPublic);
return (ViewResult)fi.GetValue(this);
}
set
{
FieldInfo fi = typeof(ChartTrackballController).GetField("result", BindingFlags.Instance | BindingFlags.NonPublic);
fi.SetValue(this, value);
}
}
protected override ActionResult OnMouseMove(MouseEventArgs e)
{
if (this.Area.View == null)
{
return Controller.Empty;
}
double panX = ((IChartView)this.Area.View).PlotOriginX;
double panY = ((IChartView)this.Area.View).PlotOriginY;
PointF searchLocation = new Point();
searchLocation.X = (float)(e.Location.Y - this.Area.View.Viewport.Y - panY);
searchLocation.Y = (float)(e.Location.X - this.Area.View.Viewport.X - panX);
this.MoveTrackball(searchLocation);
this.Result.ShouldInvalidate = true;
return this.Result;
}
}I hope this information helps.
Regards,
Dess | Tech Support Engineer, Principal
Progress Telerik
Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.