6 Answers, 1 is accepted
Hello, Johnny,
Considering the provided picture it looks like that the different series are plotted in two different charts with different axes. The possible solution that I can suggest in order to achieve the look from the picture is to add two identical charts stacked one after the other. Thus, you can display the desired series and show the required data.
I prepared a sample project to demonstrate this approach. The result is illustrated below:
public RadForm1()
{
InitializeComponent();
CandlestickSeries candlestickSeries = new CandlestickSeries();
candlestickSeries.DataPoints.Add(new OhlcDataPoint(10, 11, 7, 8, DateTime.Now));
candlestickSeries.DataPoints.Add(new OhlcDataPoint(8, 9, 5, 9, DateTime.Now.AddDays(1)));
candlestickSeries.DataPoints.Add(new OhlcDataPoint(12, 12, 9, 10, DateTime.Now.AddDays(2)));
candlestickSeries.DataPoints.Add(new OhlcDataPoint(7, 10, 6, 9, DateTime.Now.AddDays(3)));
this.radChartView1.Series.Add(candlestickSeries);
this.radChartView1.View.Margin = new Padding(2);
BarSeries barSeries = new BarSeries("Performance", "RepresentativeName");
barSeries.Name = "Q1";
barSeries.DataPoints.Add(new CategoricalDataPoint(177, "Harley"));
barSeries.DataPoints.Add(new CategoricalDataPoint(128, "White"));
barSeries.DataPoints.Add(new CategoricalDataPoint(143, "Smith"));
barSeries.DataPoints.Add(new CategoricalDataPoint(111, "Jones"));
barSeries.DataPoints.Add(new CategoricalDataPoint(118, "Marshall"));
this.radChartView2.Series.Add(barSeries);
this.radChartView2.View.Margin = new Padding(2);
}
I hope this information helps. Let me know if I can assist you further.
Regards,
Nadya
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.
Rank 1
Veteran
Rank 1
Veteran
Hello, Johnny,
Thank you for the provided feedback about RadChartView.
You can arrange different series in one chart. This can be done by adding the desired series to the Series collection of the chart. For example, it is possible to add CandlestickSeries and BarSeries in the same chart.
Note, Trackball and RadRangeSelector can be defined per one RadChartView control only. For example, you can not have one range selector for several charts. I modified my sample project by adding the CandlestickSeries and BarSeries in the same chart. However, the visual result should not be the same as the one shown picture that you provided. Below you can find my sample project that demonstrates how you can use RadChartView with multiple series and Trackball and RadRangeSelector enabled.
public RadForm1()
{
InitializeComponent();
DateTime dt = DateTime.Now;
CandlestickSeries candlestickSeries = new CandlestickSeries();
candlestickSeries.DataPoints.Add(new OhlcDataPoint(10, 11, 7, 8, dt));
candlestickSeries.DataPoints.Add(new OhlcDataPoint(18, 9, 5, 9, dt.AddDays(1)));
candlestickSeries.DataPoints.Add(new OhlcDataPoint(12, 12, 9, 10, dt.AddDays(2)));
candlestickSeries.DataPoints.Add(new OhlcDataPoint(13, 14, 6, 9, dt.AddDays(3)));
this.radChartView1.Series.Add(candlestickSeries);
CandlestickSeries candlestickSeries2 = new CandlestickSeries();
candlestickSeries2.DataPoints.Add(new OhlcDataPoint(6, 7, 3, 4, dt));
candlestickSeries2.DataPoints.Add(new OhlcDataPoint(6, 2, 3, 4, dt.AddDays(1)));
candlestickSeries2.DataPoints.Add(new OhlcDataPoint(17, 18, 12, 13, dt.AddDays(2)));
candlestickSeries2.DataPoints.Add(new OhlcDataPoint(7, 9, 5, 5, dt.AddDays(3)));
this.radChartView1.Series.Add(candlestickSeries2);
BarSeries barSeries = new BarSeries();
barSeries.DataPoints.Add(new CategoricalDataPoint(1,dt));
barSeries.DataPoints.Add(new CategoricalDataPoint(7,dt.AddDays(1)));
barSeries.DataPoints.Add(new CategoricalDataPoint(5, dt.AddDays(2)));
barSeries.DataPoints.Add(new CategoricalDataPoint(4, dt.AddDays(3)));
this.radChartView1.Series.Add(barSeries);
candlestickSeries.HorizontalAxis.LabelFitMode = AxisLabelFitMode.MultiLine;
radChartView1.Controllers.Add(new ChartTrackballController());
radChartView1.ShowTrackBall = true;
this.radRangeSelector1.AssociatedControl = this.radChartView1;
}I hope this information is useful. If you have other questions please let me know.
Regards,
Nadya
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.
Rank 1
Veteran
Hello, Johnny,
Currently, this is the behavior that RadChartView offers. If it is not suitable for your case feel free to use two separate RadChartViews with associated range selector and a track bar for each chart.
If other customers have similar requests, we will consider this functionality change in the future improvement of the control. Thank you for your understanding.
I hope this information helps. If you need any further assistance please don't hesitate to contact me.
Regards,
Nadya
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.