Change YAxis Step on client-side

2 posts, 0 answers
  1. Stefania
    Stefania avatar
    109 posts
    Member since:
    May 2013

    Posted 25 Mar 2016 Link to this post

    Hi

    Is it possible to change the yAxis step client-side?

    something like

    chart._chartObject.options.yAxis.step = 2;

    just after obtain the data.

     

    function setDataFromService(sender, args) {
                   //Get the returned data
                   var newData = args.get_content().d;
                   if (newData.length > 0) {                   
                       chart._chartObject.options.title.text = newData[0].Name;
                       //step Y AXIS
                       chart._chartObject.options.yAxis.step = 2;
                   }
                   else
                       chart._chartObject.options.title.text = "";
                   //Set the new datasource to the RadHtmlChart
                   chart.set_dataSource(newData);               
                   //Repaint the RadHtmlChart
                   chart.repaint();       
                   //Avoid raising the OnClientResponseEnded client-side event
                   //avoid setting the received data as content for the RadXmlHttpPanel
                   args.set_cancel(true);
                   if (currentLoadingPanel != null) {
                       currentLoadingPanel.hide(currentControl);
                   }
               }

     

    Chart

    <telerik:RadHtmlChart runat="server" ID="DetailChart" ClientIDMode="Static" Transitions="false" RenderAs="Canvas" >
                            <ChartTitle>  
                                <Appearance Position="Top">
                                    <TextStyle FontSize="9px" Margin="0" Padding="0"/>
                                </Appearance>
                            </ChartTitle>
                            <ClientEvents OnLoad="onChartLoad" />
                            <Legend>
                                <Appearance Position="Bottom" Visible="true"></Appearance>
                            </Legend>
                            <Pan Enabled="true" />
                            <Zoom Enabled="true">
                                <MouseWheel Enabled="true" Lock="Y" />
                                <Selection Enabled="true" ModifierKey="Shift" />
                            </Zoom>
                            <PlotArea>
                                <Series>
                                    <telerik:ScatterLineSeries DataFieldY="YValue1" DataFieldX="XValue" MissingValues="Zero">
                                        <MarkersAppearance Visible="false" />
                                        <Appearance Overlay-Gradient="None">
                                            <FillStyle BackgroundColor="#e65100" />
                                        </Appearance>
                                        <LineAppearance Width="1px" />
                                        <LabelsAppearance Visible="false"></LabelsAppearance>
                                        <TooltipsAppearance Visible="False"></TooltipsAppearance>
                                        
                                    </telerik:ScatterLineSeries>
     
                                    <telerik:ScatterLineSeries DataFieldY="YValue2" DataFieldX="XValue" MissingValues="Zero">                                   
                                        <MarkersAppearance Visible="false" />
                                        <Appearance Overlay-Gradient="None">
                                            <FillStyle BackgroundColor="#000066" />
                                        </Appearance>
                                        <LineAppearance Width="1px" />
                                        <LabelsAppearance Visible="false"></LabelsAppearance>
                                        <TooltipsAppearance Visible="False"></TooltipsAppearance>                                  
                                    </telerik:ScatterLineSeries>
                                </Series>
     
                                <XAxis BaseUnit="Auto" Type="Date" MaxDateGroups="8">
                                    <MajorGridLines Visible="false" />
                                    <MinorGridLines Visible="false" />                               
                                    <LabelsAppearance DataFormatString="dd/MM HH:mm" Step="2">
                                        <TextStyle FontSize="10px" />
                                    </LabelsAppearance>
                                </XAxis>
                                <YAxis >
                                    <MajorGridLines Visible="true" Width="1" Color="#efefef" />
                                    <MinorGridLines Visible="false" />
                                    <LabelsAppearance >
                                        <TextStyle FontSize="10px" />
                                    </LabelsAppearance>
                                </YAxis>
                            </PlotArea>
                        </telerik:RadHtmlChart>
                        <telerik:RadXmlHttpPanel runat="server" ID="XmlHttpPanelWCF" WcfRequestMethod="POST" ClientIDMode="AutoID"
                            OnClientResponseEnding="setDataFromService " WcfServicePath="HomeWebService.asmx" OnClientResponseError="OnClientResponseError"
                            WcfServiceMethod="GetHomeChartData">
                        </telerik:RadXmlHttpPanel>

     

    Thank you

  2. Ianko
    Admin
    Ianko avatar
    1660 posts

    Posted 30 Mar 2016 Link to this post

    Hello Stefania,

    With the client-side object you should use majorUnit property instead of step. You can refer to this Kedno article—http://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/chart#configuration-yAxis.majorUnit.

    chart._chartObject.options.yAxis.majorUnit = 2;

    Also, I suggest you using the get_kendoWidget method to get the client-side object—http://docs.telerik.com/devtools/aspnet-ajax/controls/htmlchart/client-side-programming/overview#get-client-side-object-reference.

    Regards,
    Ianko
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Back to Top