Radchart x-axis points overlapping

Thread is closed for posting
10 posts, 0 answers
  1. Pawar
    Pawar avatar
    15 posts
    Member since:
    Apr 2012

    Posted 18 Apr 2012 Link to this post

    Hello,

            I've been playin with my chart display with huge number of x-axis points(possibility of point from 0 to 9999 points)

    code I've been changing and not giving proper results:  

    <

    ClientSettings EnableZoom="False" ScrollMode="Both" XScale="1/>

     I think am not usin this code in proper way, thats way am havin this issue, Please suggest me proper settings to resolve this issue.

    1>Please find the attached screen shot and observ the data mess up, if i have more points based on reqruiement.
    2>
    If I have more points(9999), that is not fitting in rachart, the resul chart is worrest, please find the attached radchart_worrestcase.png

    3>Ok, If my below code working fine
    <ClientSettings EnableZoom="False" ScrollMode="Both" XScale="1/>
    then the result as show in RadChart_xaxisfilledwith all points Case but Y-axis giving results at a point.png


    4>Is this possible to remove the renedering symbol on all charts.

    Please help me to get out from this, kiddy development.

  2. Tsvetie
    Admin
    Tsvetie avatar
    1517 posts

    Posted 23 Apr 2012 Link to this post

    Hi Pawar,

    Unfortunately, I could not quite understand the problem that you have when you add more points to the chart control. Could you please post your whole chart definition, a sample datasource with which you can reproduce the problem and explain in detail the result that you expect? It would be best if you open a formal support ticket and send us a simple running project that demonstrates the problem.

    Regarding your last question - about the loading image, I suppose you are using a skin, in which the plot area has no background (e.g. LightBlue). That is why, you should apply background to the plot area in order to fix this problem. For example:

    <telerik:RadChart ID="RadChart1" runat="server" Skin="LightBlue">
        <PlotArea>
            <Appearance>
                <FillStyle FillType="Solid" MainColor="Green" />
    Greetings,
    Tsvetie
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Pawar
    Pawar avatar
    15 posts
    Member since:
    Apr 2012

    Posted 24 Apr 2012 Link to this post

    Your help will be appriciated.

    Please find the attached screen shot the data coming in that way, Please take consideration as X-axis having more than 1000x-Axis points.   Please find the below code. If the design code and code behind is totally wrong, Am glad to change the code tooo to achieive the reuquirement.

    Thank You

    <

     

     

    telerik:RadMultiPage ID="rmpChartType" runat="server" SelectedIndex="0">

     

     

     

    <telerik:RadPageView ID="rpvCapacityDelay" runat="server">

     

     

     

    <div style="padding: 5px; text-align: left;">

     

     

     

    <asp:UpdatePanel ID="updCapacityDelay" runat="server" RenderMode="Inline" UpdateMode="Conditional">

     

     

     

    <ContentTemplate>

     

     

     

    <telerik:RadChart AutoLayout="True" Height="450px" ID="CapacityRadChart"

     

     

     

    runat="server" Skin="WebBlue" Width="935px" >

     

     

     

    <ClientSettings EnableZoom="True" ScrollMode="Both"/>

     

     

     

    <Appearance>

     

     

     

    <FillStyle MainColor="249, 250, 251">

     

     

     

    </FillStyle>

     

     

     

    <Border Color="160, 170, 182" />

     

     

     

    </Appearance>

     

     

     

    <Legend Visible="False">

     

     

     

    <Appearance Dimensions-Margins="17.6%, 3%, 1px, 1px"

     

     

     

    Dimensions-Paddings="2px, 8px, 6px, 3px"

     

     

     

    Position-AlignedPosition="TopRight" Visible="False">

     

     

     

    <ItemTextAppearance TextProperties-Color="102, 102, 102">

     

     

     

    </ItemTextAppearance>

     

     

     

    <FillStyle MainColor="216, 222, 227">

     

     

     

    </FillStyle>

     

     

     

    <Border Color="160, 170, 182" />

     

     

     

    </Appearance>

     

     

     

    </Legend>

     

     

     

    <PlotArea>

     

     

     

    <YAxis AutoScale="True" AxisMode="Extended">

     

     

     

    <Appearance Color="160, 160, 160">

     

     

     

    <MajorGridLines Color="227, 227, 227" />

     

     

     

    <MinorGridLines Color="227, 227, 227" />

     

     

     

    <TextAppearance AutoTextWrap="False"/>

     

     

     

    </Appearance>

     

     

     

    <AxisLabel>

     

     

     

    <TextBlock>

     

     

     

    <Appearance TextProperties-Color="140, 140, 140">

     

     

     

    </Appearance>

     

     

     

    </TextBlock>

     

     

     

    </AxisLabel>

     

     

     

    </YAxis>

     

     

     

    <EmptySeriesMessage Visible="True">

     

     

     

    <Appearance Visible="True">

     

     

     

    </Appearance>

     

     

     

    </EmptySeriesMessage>

     

     

     

    <XAxis AutoScale="True" DataLabelsColumn="RIID's" MaxValue="0" Step="0"

     

     

     

    MinValue="-30000000">

     

     

     

    <Appearance Color="160, 160, 160">

     

     

     

    <MajorGridLines Color="227, 227, 227" Width="0" />

     

     

     

    <TextAppearance AutoTextWrap="True" TextProperties-Color="140, 140, 140" />

     

     

     

    </Appearance>

     

     

     

    <AxisLabel>

     

     

     

    <TextBlock>

     

     

     

    <Appearance TextProperties-Color="140, 140, 140">

     

     

     

    </Appearance>

     

     

     

    </TextBlock>

     

     

     

    </AxisLabel>

     

     

     

    </XAxis>

     

     

     

    <Appearance Dimensions-Margins="18%, 24%, 12%, 10%">

     

     

     

    <FillStyle FillType="Solid" MainColor="">

     

     

     

    </FillStyle>

     

     

     

    </Appearance>

     

     

     

    </PlotArea>

     

     

     

    <ChartTitle>

     

     

     

    <Appearance>

     

     

     

    <FillStyle MainColor = "">

     

     

     

    </FillStyle>

     

     

     

    </Appearance>

     

     

     

    <TextBlock Text="Capacity Timeliness" >

     

     

     

    <Appearance TextProperties-Color="102, 102, 102"

     

     

     

    TextProperties-Font="Arial, 14pt">

     

     

     

    </Appearance>

     

     

     

    </TextBlock>

     

     

     

    </ChartTitle>

     

     

     

    </telerik:RadChart>


    Code Behind



     

    radchartcontrole.Clear()

    radchartcontrole.PlotArea.XAxis.AutoScale =

     

    False

     

     

     

     

     

    radchartcontrole.PlotArea.XAxis.IsZeroBased =

     

    False

     

     

     

     

     

    radchartcontrole.PlotArea.XAxis.AutoShrink =

     

    True

     

     

     

     

     

    radchartcontrole.PlotArea.XAxis.LabelStep = 300

    radchartcontrole.DataSource = ds.Tables.Item(charttableValue)

    radchartcontrole.DataBind()

     

     

    'radchartcontrole.Series(0).DataXColumn = dataXColumnName

     

     

     

     

     

    radchartcontrole.Series(0).DataYColumn = dataYColumnName

     

     

    'radchartcontrole.PlotArea.XAxis.DataLabelsColumn = dataXColumnName

     

     

     

     

     

    radchartcontrole.PlotArea.XAxis.DataLabelsColumn = dataXColumnName

     

    radchartcontrole.PlotArea.XAxis.AxisLabel.TextBlock.Text = xaxislableName

    radchartcontrole.PlotArea.XAxis.AxisLabel.Visible =

     

    True

     

     

     

     

     

    radchartcontrole.PlotArea.XAxis.AxisLabel.TextBlock.Appearance.TextProperties.Color = System.Drawing.

     

    Color.Red

     

    radchartcontrole.PlotArea.XAxis.AxisLabel.TextBlock.Appearance.Position.Auto =

     

    True

     

     

     

     

     

    radchartcontrole.PlotArea.YAxis.AxisLabel.Visible =

     

    True

     

     

     

     

     

    radchartcontrole.PlotArea.YAxis.AxisLabel.TextBlock.Text = yaxislableName

    radchartcontrole.PlotArea.YAxis.AxisLabel.TextBlock.Appearance.TextProperties.Color = System.Drawing.

     

    Color.Red

     

    radchartcontrole.PlotArea.YAxis.AxisLabel.TextBlock.Appearance.Position.Auto =

     

    True

     

     

     

     

     

    radchartcontrole.Series(0).Appearance.BarWidthPercent =

     

    CType("10", Decimal)

     

  5. Pawar
    Pawar avatar
    15 posts
    Member since:
    Apr 2012

    Posted 26 Apr 2012 Link to this post

    Am working on this question from past 1month,
  6. Tsvetie
    Admin
    Tsvetie avatar
    1517 posts

    Posted 27 Apr 2012 Link to this post

    Hello Pawar,

    Could you please explain in detail the result that you are trying to achieve and the one that you get with the posted code? In case you have problems with the performance of the chart, please refer to this forum post for additional information.

    In the meantime, you can set the following, so that the axis items text does not wrap:
    radchartcontrole.PlotArea.XAxis.Appearance.TextAppearance.AutoTextWrap = Telerik.Charting.Styles.AutoTextWrap.False;

    Additionally, please make sure that you have not enabled the intelligent labels feature with so many points. In general, I would advise you to not show labels for the items at all:
    radchartcontrole.PlotArea.XAxis.Appearance.TextAppearance.AutoTextWrap = Telerik.Charting.Styles.AutoTextWrap.False;
    radchartcontrole.IntelligentLabelsEnabled = false;

    One thing that you should keep in mind, is that in case there are a lot of bar items (>1000), you will not be able to see them, because there will be less than one pixel width, available to each of them.

    As a general rule, we do not recommend to our customers to show thousands of points in the chart. You can, for example, combine several datapoints in one chart item, as described in the references forum post.
     
    Kind regards,
    Tsvetie
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  7. Pawar
    Pawar avatar
    15 posts
    Member since:
    Apr 2012

    Posted 27 Apr 2012 Link to this post

    Tsvetie, We appriciate your time in this issue,

    Ok, Simply. I would like to set some number of axis points(300-400) in the chart with single series, attached screen shot 1. Am not sure with Horizontal pixel size for this chart, my understanding as per applicaiton screen, I would like to show 300-400 points A4 size chart

    As it won't possible to fit number of 300-400axis points in the limitted chart area,
                Idea1.Am trying to set the 300-400points by giving zoom option. 
                Idea2.Poroviding the scroll on x-axis (from left to right) to see all the x-axis points.
             Is there any possibility to acheive Idea1&2 please let me know.
            
    Note:  We used to select 1000x-axis points(Input parameters selection 24months and above)
               
               As you suggested below, 
               We came down to
    300-400(Input parameters selection 6months) points on x-axis.

    Still am looking is there any possibility to acheive this with 300-400 x-Axis points?
  8. Pawar
    Pawar avatar
    15 posts
    Member since:
    Apr 2012

    Posted 30 Apr 2012 Link to this post

    Hi Tsvetie,

            I found that, Peter Kellner posted code works for me, I didn't understand how his doing with chartSeries.AddItem( new ChartSeriesItem(listData[i].x, listData[i].y));  If you could give me good example, that would be appriciated.
    http://www.telerik.com/community/forums/aspnet-ajax/chart/performance-problem-on-line-chart.aspx

    Thank You,    
  9. Tsvetie
    Admin
    Tsvetie avatar
    1517 posts

    Posted 02 May 2012 Link to this post

    Hello,

    I have attached a demo page, demonstrating how you can configure the zoom level of the chart initially. I hope this code helps you configure your chart control. In case you need additional help, please open a formal support ticket and send me a running test project, demonstrating the problem that you have.

    Kind regards,
    Tsvetie
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  10. Pawar
    Pawar avatar
    15 posts
    Member since:
    Apr 2012

    Posted 07 May 2012 Link to this post

    Hello,

            Is this possible to show nagative values on x-Axis by using the attached code?

    Thank You Very much,
    Satish.
  11. Tsvetie
    Admin
    Tsvetie avatar
    1517 posts

    Posted 10 May 2012 Link to this post

    Hello Satish,

    In order show negative values on the x-axis with my test project, you just need to modify the data that you pass to the chart control so that some points have negative XValue. For example:

    Private Function GetDataSource() As List(Of Class1)
        Dim r As New Random()
        Dim source As List(Of Class1) = New List(Of Class1)
     
        For i As Integer = -200 To 200
            Dim item As New Class1()
     
            item.XValue = i
            item.YValue = r.[Next](0, 100)
     
            source.Add(item)
        Next
     
        Return source
    End Function
    Regards,
    Tsvetie
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017