[Solved] Zooming AJAX Chart in MVC?

[mladen]

Hi,
when using the zooming enabled chart from AJAX extendsions like follow:

<form runat="server">
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server"/>
    <%
        DataTable dt = new DataTable();
        dt.Columns.Add(new DataColumn("MyColumn", typeof(int)));

        Random rand = new Random(DateTime.Now.Millisecond);
        for (int i = 0; i < 20; i++)
        {
            DataRow dr = dt.NewRow();
            dr[0] = rand.Next(20);
            dt.Rows.Add(dr);
        }

        RadChart1.DataSource = dt;
        RadChart1.DataBind();
        RadChart2.DataSource = dt;
        RadChart2.DataBind();
        RadChart3.DataSource = dt;
        RadChart3.DataBind();
    %>

    <h2><%= Html.Encode(ViewData["Message"]) %></h2>
    <p>
        telerik chart test
    </p>
     <telerik:RadChart ID="RadChart3" runat="Server" Width="495px" AutoLayout="true" Skin="Mac">
        <Series>
            <telerik:ChartSeries DataYColumn="MyColumn" Type="Line">
            </telerik:ChartSeries>
        </Series>
        <Legend Visible="false"></Legend>
        <ChartTitle TextBlock-Text="Zooming / Scrolling (no scrolling)">
        </ChartTitle>
    </telerik:RadChart>

    <br />

     <telerik:RadChart ID="RadChart1" runat="Server" Width="495px" AutoLayout="true" Skin="Mac">
        <ClientSettings ScrollMode="Both" />
        <Series>
            <telerik:ChartSeries DataYColumn="MyColumn" Type="Line">
            </telerik:ChartSeries>
        </Series>
        <Legend Visible="false"></Legend>
        <ChartTitle TextBlock-Text="Zooming / Scrolling (no initial scaling)">
        </ChartTitle>
    </telerik:RadChart>

    <br />

    <telerik:RadChart  ID="RadChart2" runat="Server" Width="495px" AutoLayout="true" Skin="Mac">
        <ClientSettings EnableZoom="false" ScrollMode="XOnly" XScale="4" />
        <Series>
            <telerik:ChartSeries DataYColumn="MyColumn" Type="Line">
                <Appearance FillStyle-MainColor="223, 87, 60">
                </Appearance>
            </telerik:ChartSeries>
        </Series>
        <Legend Visible="false"></Legend>
        <ChartTitle TextBlock-Text="Scrolling only (initial XScale applied)">
        </ChartTitle>
    </telerik:RadChart>
    </form>

I get the attached error shown in FF. Any idea?

[Atanas Korchev]

Hi mladen,

Setting the action of the form will help:

<form runat="server" id="theForm" action="/">

Regards,
Atanas Korchev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[mladen]

Thanks for the fast response. I tried that, also using the [Controller]...it does not help :-(

Removing  <ClientSettings ScrollMode="Both" /> shows that the chart is ok, just the zooming fails.
Do you have a working example?

[Giuseppe]

Hello Mladen,

Unfortunately the zooming & scrolling feature of RadChart for ASP.NET AJAX is not available in MVC scenarios -- sorry for misleading you with our previous reply.

Alternatively, you to consider integrating the RadChart for Silverlight control instead, as we believe it already provides mature and superior set of features compared to its ASP.NET counterpart (you can find the the Silverlight zooming & scrolling example here as well).


All the best,
Freddie
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.