This is a migrated thread and some comments may be shown as answers.

Sparklines: Chart Axis Orientation, Databinding and non-XAML questions (3)

3 Answers 151 Views
Sparkline
This is a migrated thread and some comments may be shown as answers.
Daryl
Top achievements
Rank 1
Daryl asked on 23 Mar 2011, 08:37 PM
A few questions after playing with the Sparkline example here : C:\Program Files (x86)\Telerik\RadControls for WPF Q3 2010 SP1\Demos\Examples\BulletGraph

1.  Can a RadColumnSparkline show the bars in a horizontal orientation?  Default seems to be vertical - I didn't see a property to change orientation.

2.  The examples all seem to bind to a DateTime on the X-Axis.  Is it possible to bind to something like a string and if so what would happen?

Where your current example data looks like:
actual,Late arrivals,11/1/2004,1
actual,Late arrivals,12/1/2004,24
actual,Late arrivals,1/1/2005,32

What if I wanted to bind to NOTE: the date is replaced by a string (site name) value:

web ranking,Site 1, 1000
web ranking,Site 2, 2222
web ranking,Site 3, 4444

3.  Do you have an example of how to do some of this XAML binding in C# code rather than XAML?  In essence doing this type of thing in a non-xaml/dynamic way?
              <telerik:GridViewDataColumn Header="actuals nov'04 - nov'05">
                    <telerik:GridViewDataColumn.CellTemplate>
                        <DataTemplate>
                            <telerik:RadColumnSparkline ShowFirstPointIndicator="True" ShowLastPointIndicator="True" ShowHighPointIndicators="True" ShowLowPointIndicators="True" ItemsSource="{Binding ActualMeasure}" XValuePath="Date" YValuePath="Value" Width="120" Height="20" />
                        </DataTemplate>
                    </telerik:GridViewDataColumn.CellTemplate>
                </telerik:GridViewDataColumn>

4.  I'm adding another question to the post:

I have 5 data points, but the chart is only showing 4 of the points. Like it is throwing out the lowest data point and not plotting it at all.  Is that a function of telerik:RadColumnSparkline attribute?


actual,(Google) Day Spas in Houston,11/1/2004,100
actual,(Google) Day Spas in Houston,12/1/2004,75
actual,(Google) Day Spas in Houston,1/1/2005,72
actual,(Google) Day Spas in Houston,2/1/2005,77
actual,(Google) Day Spas in Houston,3/1/2005,66


 <telerik:RadColumnSparkline ShowAxis="true" ShowLastPointIndicator="True" ShowFirstPointIndicator="True" ShowHighPointIndicators="True" ShowLowPointIndicators="True"  ItemsSource="{Binding ActualMeasure}" XValuePath="Date" YValuePath="Value" Width="120" Height="20" />

3 Answers, 1 is accepted

Sort by
0
Yavor
Telerik team
answered on 28 Mar 2011, 02:58 PM
Hi Daryl,

Thanks for using RadSparklines!

1) Currently there are only column RadSparklines (or vertical bars). RadSparklines follow E. Tufte specifications. He mentions a horizontal bar that fits in one grid cell, but currently we haven't created it. Instead we introduced RadBulletGraph which is very similar, but has more features and can be used in more business scenarios.

2) Sparklines can bind only to numeric data. You can find more information on this topic in our help system here.

3) Unfortunately currently we don't have an example how to create a DataTemplate for a grid column in code behind as this is not the recommended best practice. Still you can create a DataTemplate in code behind as explained in this topic on MSDN.

4) This behavior of column sparklines is expected. If you have 5 points the smallest gets 0px height as its value is equal to the minimum value of the range. You can workaround this by setting a custom value for minimum.

Again your feedback is most welcome! If you have any trouble with RadSparklines we'll be happy to assist you.

Greetings,
Yavor Ivanov
the Telerik team
0
Daryl
Top achievements
Rank 1
answered on 28 Mar 2011, 08:08 PM

Thanks Yavor for the reply, it was helpful.

I could use a little clarification on what property to set for this:

4) This behavior of column sparklines is expected. If you have 5 points the smallest gets 0px height as its value is equal to the minimum value of the range. You can workaround this by setting a custom value for minimum.


I tried setting this attribute but it didn't work.  What would I set to make a "custom" value for minimum that you speak of above?

 

 

MinYValue

 

 

="1000"

 


0
Yavor
Telerik team
answered on 31 Mar 2011, 08:29 AM
Hi Daryl,

RadSparklines use AutoRange by default to calculate the range of the underlying data. Let me give an example here. If you pass to your column sparkline an array of integers
this.sparkline.ItemsSource = new int[] { 3, 4, 5, 6 };
the range of data is min=3, max=6. Because sparklines are minimalistic, the first column will get height = 0px, and the last one height = max (without some margins). You can override the automatic calculation of the range by setting AutoRange = False and MinYValue like this:
MinYValue="2" AutoRange="False"

Now the first column (the smallest one) will be visible, because it is no longer the smallest in the new range.

Regards,
Yavor Ivanov
the Telerik team
Tags
Sparkline
Asked by
Daryl
Top achievements
Rank 1
Answers by
Yavor
Telerik team
Daryl
Top achievements
Rank 1
Share this question
or