RadHtmlChart stock layout loses data

4 posts, 0 answers
  1. Nick
    Nick avatar
    5 posts
    Member since:
    Jul 2016

    Posted 11 Oct Link to this post

    Hi,

    I have a RadHtmlChart with dynamic data binding and DateTime values on the x-axis.

    I'd like to put a Navigator under the chart, and I know that that is possible only if property Layout  = "Stock".

    But when I set this value on the Layout property, the chart appears very approximate, and almost impossible to read (example images attached).

    Why is this happening?  Is there a way to show the chart with every value or, at least, reduce the amount of this approximation?

    Thank you.

  2. Vessy
    Admin
    Vessy avatar
    1388 posts

    Posted 12 Oct Link to this post

    Hi Nick,

    I am afraid that the provided information is not enough to determine what is causing the undesired behavior. Can you send us a simple chart showing the exact configuration you are using along with sample data that the problem can be reproduced with?

    Looking forward to your reply,
    Vessy
    Telerik by Progress
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Nick
    Nick avatar
    5 posts
    Member since:
    Jul 2016

    Posted 22 Nov Link to this post

    Thank you for your answer. Unfortunately I'm unable to attach a sample project, so I'm going to paste the configuration. I hope that can help to understand the source of my problem

    <telerik:RadHtmlChart runat="server" ID="RadChart1">
      <Pan Enabled="true" />
      <Zoom Enabled="true">
        <MouseWheel Enabled="true" Lock="Y" />
        <Selection Enabled="true" ModifierKey="Shift" Lock="Y" />
      </Zoom>
      <Navigator Visible="true">
        <SelectionHint Visible="true" DataFormatString="From {0} to {1}"/>
        <XAxis Type="Date">
        </XAxis>
      </Navigator>
      <PlotArea>
        <XAxis MajorTickType="None" MinorTickType="None">
          <AxisCrossingPoints>
            <telerik:AxisCrossingPoint Value="0" />
            <telerik:AxisCrossingPoint Value="999" />
          </AxisCrossingPoints>
          <MajorGridLines Visible="false" />
          <MinorGridLines Visible="false" />
        </XAxis>
        <YAxis Name="LeftAxis" AxisCrossingValue="0">
          <LabelsAppearance Step="2"></LabelsAppearance>
        </YAxis>
        <AdditionalYAxes>
          <telerik:AxisY Name="RightAxis" AxisCrossingValue="999">
            <LabelsAppearance Step="2"></LabelsAppearance>
          </telerik:AxisY>
        </AdditionalYAxes>
      </PlotArea>
    </telerik:RadHtmlChart>

     

    In my code behind I have a boolean variable which tells me to show or hide my Navigator:

    protected void ReloadChart()
    {
      RadChart1.PlotArea.Series.Clear();
      RadChart1.Navigator.Series.Clear();
       
      //Setting up navigator
      if(showNavigator)
      {
        RadChart1.Layout = Telerik.Web.UI.HtmlChart.ChartLayout.Stock; //Without this layout, navigator is not supported.
        RadChart1.Navigator.RangeSelector.From = minDate;
        RadChart1.Navigator.RangeSelector.To = maxDate;  //previously calculated values..
        RadChart1.Navigator.Visible = true;
      }
      else
      {
        RadChart1.Layout = Telerik.Web.UI.HtmlChart.ChartLayout.Default;
        RadChart1.Navigator.RangeSelector.From = null;
        RadChart1.Navigator.RangeSelector.To = null;
        RadChart1.Navigator.Visible = false;
      }
     
      //Adding series to chart and navigator
      LineSeries lineS = new LineSeries();
      lineS.DataFieldY = myDataTable[0].Caption;
      lineS.AxisName = "LeftAxis";
      lineS.LineAppearance.Width = Unit.Pixel(2);
      lineS.LabelsAppearance.Visible = false;
      lineS.MissingValues = Telerik.Web.UI.HtmlChart.MissingValuesBehavior.Interpolate;
      if(showNavigator)
        RadChart1.Navigator.Series.Add(lineS);
      RadChart1.PlotArea.Series.Add(lineS);
     
      //Chart settings:
      RadChart1.PlotArea.XAxis.DataLabelsField = "Date";
      RadChart1.PlotArea.XAxis.LabelsAppearance.DataFormatString = "dd/MM/yyyy";
      RadChart1.PlotArea.XAxis.LabelsAppearance.RotationAngle = -40;
      RadChart1.Legend.Appearance.Visible = true;
      RadChart1.Legend.Appearance.Position = Telerik.Web.UI.HtmlChart.ChartLegendPosition.Top;
     
      RadChart1.PlotArea.XAxis.LabelsAppearance.Step = 4;
      RadChart1.PlotArea.XAxis.AxisCrossingPoints.Clear();
      RadChart1.PlotArea.XAxis.AxisCrossingPoints.Add(0);
      RadChart1.PlotArea.XAxis.AxisCrossingPoints.Add((myDataTable.Rows.Count * 2) + 1);
      RadChart1.PlotArea.YAxis.TitleAppearance.Text = someString;
      RadChart1.PlotArea.AdditionalYAxes[0].TitleAppearance.Text = someOtherString;
      RadChart1.PlotArea.YAxis.AxisCrossingValue = -999999;
      RadChart1.PlotArea.AdditionalYAxes[0].AxisCrossingValue = -999999;
     
      //Data biding
      RadChart1.DataSource = m_LogList;
      RadChart1.DataBind();
    }

     

     

    Thank you,

    N

     

  5. Stamo Gochev
    Admin
    Stamo Gochev avatar
    157 posts

    Posted 25 Nov Link to this post

    Hello Nick,

    As far as I can understand from the provided code snippet and screenshots, the described functionality is not supported out of the box for stock charts.

    However, if using a category axis (instead of date axis and stock chart) is applicable in your case, the initial number of series items that are shown can be controlled by the MaxValue property of the X axis as mentioned in our documentation:

    http://docs.telerik.com/devtools/aspnet-ajax/controls/htmlchart/functionality/zoom-pan-scroll#controlling-initial-view

    Setting it to 10 for example will display only 10 items when the chart is displayed for the first time and any further zooming action can change this.

    Regards,
    Stamo Gochev
    Telerik by Progress
    Telerik UI for ASP.NET AJAX is ready for Visual Studio 2017 RC! Learn more.
Back to Top