Home / Community & Support / Developer Productivity Tools Forums / ASP.NET > Chart > Big blank space in left and right side

• Debashis Pyne

  Posted on Jun 22, 2011 (permalink)

  Hi,
  
  I am showing a bar chart using the rad chart. this chart may show thousands of data at a time. So it is not possible for me to fix the width of the chart. What I have done is - 

  • I placed the chart inside a asp panel with scroll bars.
  • I am calculating the with depending on the number of records.

  Everything is fine upto this level. My problem is that when there are lots of data needs to show the chart is leaving a big blank space at the left and and the right side.
  
  Now to remove this blank space I have done the followings

  • set the AutoLayout property to false
  • And added the following settings

  <PlotArea>

     <Appearance Dimensions-Margins="15%, 10px, 35%, 10px" >

     </Appearance>

  </PlotArea>

  It removed left side blank space (need some changes in the value for fine tunning), but now this brings one more problem. the X-axis labels are now overlapping on the graph itself. Now I cannot understand how to manage this.
  
  Can anyone help me sort this out.
  
  Thanks in advance.
  

• Polina Polina

  Posted on Jun 24, 2011 (permalink)

  Hello Debashis Pyne,
  
  You can take advantage of the Zooming and Scrolling functionality, which provides easy navigation through the chart data. In order to position the chart elements properly you can use the AutoLayout functionality. It instructs the control to perform layout arrangement automatically for optimal utilization of the whole chart area and ensures that all chart elements are fully readable and do not overlap with one another. To enable this feature set the RadChart.AutoLayout to True. Another approach is to set the dimensions of the PlotArea manually. For example:
  

  <asp:ScriptManager ID="ScriptManager1" runat="server">

  </asp:ScriptManager>

  <div>

      <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">

          <ContentTemplate>

              <telerik:RadChart ID="RadChart1" runat="server">

                  <ClientSettings EnableZoom="false" ScrollMode="Both" XScale="2" />

                  <PlotArea>

                      <Appearance Dimensions-Margins="10%, 5%, 15%, 6%"></Appearance>

                  </PlotArea>

                  ...

              </telerik:RadChart>

          </ContentTemplate>

      </asp:UpdatePanel>

  </div>

  
  For additional information on Zooming and Scrolling feature, please refer to the following online resources:
  http://demos.telerik.com/aspnet-ajax/chart/examples/newfeatures/zoomingscrolling/defaultcs.aspx
  http://www.telerik.com/help/aspnet-ajax/radchart-zoom-scroll.html
  
  In case the following information does not help you, could you please send us a sample project that demonstrates the unwanted behavior. Thus we will do our best to provide a solution.
  
  Greetings,
  

  Polina

  the Telerik team

  Consider using RadControls for ASP.NET AJAX (built on top of the ASP.NET AJAX framework) as a replacement for the Telerik ASP.NET Classic controls, See the product support lifecycle here.

Back to Top

Home / Community & Support / Developer Productivity Tools Forums / ASP.NET > Chart > Big blank space in left and right side