Telerik RadCharts

[amulya]

In Telerik RadCharts ,from Multiple series, when click on single series should take maximum point and minimum points and bind that data to another  chart .

Approximate pictures:

when i take 1st chart and click on single series it should generate 2nd chart with the selected Single series 

[amulya]

Please look into charts and give solution as asap

[Danail Vasilev]

Hi Amulya,

You can handle the click event of the chart, obtain the min/max value of the clicked series and use these values for the newly created chart. For example:

ASPX:

<telerik:RadChart ID="RadChart1" runat="server" Height="400px" Width="600px" OnClick="RadChart1_Click">
    <Series>
        <telerik:ChartSeries Type="Line" Name="Series 1">
            <Items>
                <telerik:ChartSeriesItem YValue="30">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem YValue="10">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem YValue="20">
                </telerik:ChartSeriesItem>
            </Items>
            <Appearance>
                <PointMark Border-Color="Green" Visible="true"></PointMark>
            </Appearance>
        </telerik:ChartSeries>
    </Series>
    <PlotArea>
        <XAxis AutoScale="false">
            <Items>
                <telerik:ChartAxisItem TextBlock-Text="item 1"></telerik:ChartAxisItem>
                <telerik:ChartAxisItem TextBlock-Text="item 2"></telerik:ChartAxisItem>
                <telerik:ChartAxisItem TextBlock-Text="item 3"></telerik:ChartAxisItem>
            </Items>
        </XAxis>
        <YAxis>
        </YAxis>
    </PlotArea>
</telerik:RadChart>
<telerik:RadChart ID="RadChart2" runat="server" Height="400px" Width="600px" OnClick="RadChart1_Click">
    <Series>
        <telerik:ChartSeries Type="Line" Name="Series 1">
            <Items>
                <telerik:ChartSeriesItem YValue="0">
                </telerik:ChartSeriesItem>
                <telerik:ChartSeriesItem YValue="0">
                </telerik:ChartSeriesItem>
            </Items>
        </telerik:ChartSeries>
    </Series>
    <PlotArea>
        <XAxis AutoScale="false">
            <Items>
                <telerik:ChartAxisItem TextBlock-Text="item 1"></telerik:ChartAxisItem>
                <telerik:ChartAxisItem TextBlock-Text="item 2"></telerik:ChartAxisItem>
            </Items>
        </XAxis>
        <YAxis>
        </YAxis>
    </PlotArea>
</telerik:RadChart>

C#:

protected void RadChart1_Click(object sender, Telerik.Charting.ChartClickEventArgs e)
{
    double minValue = e.Series.Items[0].YValue;
    double maxValue = e.Series.Items[0].YValue;
    if (e.Series != null)
    {
        for (int i = 1; i < e.Series.Items.Count; i++)
        {
            if (e.Series.Items[i].YValue > maxValue)
            {
                maxValue = e.Series.Items[i].YValue;
            }
            if (e.Series.Items[i].YValue < minValue)
            {
                minValue = e.Series.Items[i].YValue;
            }
        }
    }
    RadChart2.Series[0].Items[0].YValue = minValue;
    RadChart2.Series[0].Items[1].YValue = maxValue;
}

You may also find useful this online demo.

Regards,
Danail Vasilev
Telerik