Quick Question: Does ChartView support log scale X axis?

10 posts, 0 answers
  1. Brian
    Brian avatar
    73 posts
    Member since:
    Sep 2010

    Posted 07 Mar 2012 Link to this post

    Does ChartView support log scale X axis?  We have been using the Chart control, but it doesn't support a logarithmic scale on the X axis. 
  2. Bartholomeo Rocca
    Bartholomeo Rocca avatar
    247 posts
    Member since:
    May 2006

    Posted 09 Mar 2012 Link to this post

    Hello Brian,

    You can achieve the desired effect by initializing the RadCartesianChart.HorizontalAxis property with an instance of LogarithmicAxis (in this case you will need to use scatter-like series e.g. ScatterLine, ScatterPoint, etc as both horizontal and vertical axes will be numerical).


    Greetings,
    Bart.
  3. DevCraft banner
  4. Brian
    Brian avatar
    73 posts
    Member since:
    Sep 2010

    Posted 09 Mar 2012 Link to this post

    You wouldn't happen to have an example of this would you?  I am not familiar with the ChartView control yet as we have only used the Chart control to this point.
    Tks.
  5. Giuseppe
    Admin
    Giuseppe avatar
    2363 posts

    Posted 14 Mar 2012 Link to this post

    Hello Brian,

    Here is a sample code snippet to get you started:
    <telerik:RadCartesianChart x:Name="RadChart1">
     
        <telerik:ScatterPointSeries>
            <telerik:ScatterDataPoint XValue="7" YValue="10000" />
            <telerik:ScatterDataPoint XValue="100" YValue="200000" />
            <telerik:ScatterDataPoint XValue="1000" YValue="750000" />
            <telerik:ScatterDataPoint XValue="1300" YValue="50000" />
            <telerik:ScatterDataPoint XValue="20000" YValue="1700000" />
            <telerik:ScatterDataPoint XValue="25000" YValue="1000" />
            <telerik:ScatterDataPoint XValue="670000" YValue="44000" />
        </telerik:ScatterPointSeries>
     
        <telerik:RadCartesianChart.HorizontalAxis>
            <telerik:LogarithmicAxis />
        </telerik:RadCartesianChart.HorizontalAxis>
        <telerik:RadCartesianChart.VerticalAxis>
            <telerik:LogarithmicAxis />
        </telerik:RadCartesianChart.VerticalAxis>
                 
        <telerik:RadCartesianChart.Grid>
            <telerik:CartesianChartGrid MajorLinesVisibility="XY" />
        </telerik:RadCartesianChart.Grid>
    </telerik:RadCartesianChart>



    All the best,
    Giuseppe
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  6. Brian
    Brian avatar
    73 posts
    Member since:
    Sep 2010

    Posted 20 Mar 2012 Link to this post

    I have implemented your example and have attempted to add another ScatterDataPoint where the XValue = 0.  However, the X axis never shows 0.  It always starts at 1.  And, the new point that I added whose XValue = 0 actually shows up at X = 1.

    How can I make it start at 0 or at least a value lower than my lowest value?  Is it possible to manually set the axis values?

    Here is my code:

    var xAxis = new LogarithmicAxis { Title = "CDU (log)" };
    MyChart.HorizontalAxis = xAxis;

    var yAxis = new LinearAxis { Title = "% Baseline" };
    MyChart.VerticalAxis = yAxis;

    var series = new ScatterPointSeries();
    series.DataPoints.Add(new ScatterDataPoint() { XValue = 0.0, YValue = 100 });
    series.DataPoints.Add(new ScatterDataPoint() { XValue = 0.1, YValue = 101 });
    series.DataPoints.Add(new ScatterDataPoint() { XValue = 11, YValue = 106 });
    series.DataPoints.Add(new ScatterDataPoint() { XValue = 101, YValue = 104 });
    series.DataPoints.Add(new ScatterDataPoint() { XValue = 101, YValue = 108 });

    MyChart.Series.Add(series);


    Attached is a screen shot of how my graph displays.  Notice the (0.0, 100) point is not showing up correctly.

    Also, how can I make the actual points show up differently?  I'd like each point to be a different shape (circle, square, etc.) as well as a different color.

    Tks.
  7. Giuseppe
    Admin
    Giuseppe avatar
    2363 posts

    Posted 22 Mar 2012 Link to this post

    Hello Brian,

    Onto your questions:
    • Negative or zero values cannot be plotted correctly on log charts due to the specifics of the logarithm function so it would not be possible to plot a point with XValue=0.
    • You can control the range of a logarithmic axis through its LogarithmicAxis.Minimum / Maximum / ExponentStep properties.
    • You can customize the point appearance through DataTemplateSelector (set it to ScatterPointSeries.PointTemplateSelector) and MVVM bindings -- see the attached sample application to get you started.

    Hope this helps.


    Greetings,
    Giuseppe
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  8. Brian
    Brian avatar
    73 posts
    Member since:
    Sep 2010

    Posted 22 Mar 2012 Link to this post

    Hmmm...this isn't sounding good.  So, just to get to the point that I need, is there any way with the Telerik Silverlight controls which we are using (latest version) to produce the attached graph?

    Tks.
  9. Giuseppe
    Admin
    Giuseppe avatar
    2363 posts

    Posted 23 Mar 2012 Link to this post

    Hello Brian,

    As noted in our previous reply such graph cannot start at XValue=0 for logarithmic axis due to purely mathematical rules. However, it is possible to customize the first axis item label in any way you want -- the underlying value would still be greater than 0 but the label can display 0 nonetheless.

    See the attached modified sample application that demonstrates axis item label customization with DataTemplate.


    Kind regards,
    Giuseppe
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  10. Brian
    Brian avatar
    73 posts
    Member since:
    Sep 2010

    Posted 23 Mar 2012 Link to this post

    This is GREAT!  Thanks so much, Giuseppe.

    One thing that you didn't account for in your demo that mimic'd the graph I had given you was connecting the points via a line.  Is this possible?

    Thanks.
  11. Giuseppe
    Admin
    Giuseppe avatar
    2363 posts

    Posted 23 Mar 2012 Link to this post

    Hello Brian,

    You just need to use ScatterLineSeries instead of ScatterPointSeries and that will do the trick (all other customizations will still work with both series types).

    Hope this helps.


    Kind regards,
    Giuseppe
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
Back to Top
DevCraft banner