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

Chart is not working

5 Answers 77 Views
Chart
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
Ivan
Top achievements
Rank 1
Ivan asked on 01 Jul 2014, 07:30 AM
Hi! I've tried to integrate your chart control in my application, and have faced the following problem. In my app i have the following data class:
[Table( Name = "Statistics" )]
    public class StatItem {
        public StatItem() {
        }
 
        public StatItem( StatType type, int id, float value )
            : this( type, id, value, DateTime.UtcNow ) {
        }
 
        public StatItem( StatType type, int id, float value, DateTime dateTime ) {
            Type = type;
            ItemId = id;
            Value = value;
            DateTime = dateTime;
        }
 
        [Column( IsPrimaryKey = true, IsDbGenerated = true, CanBeNull = false, AutoSync = AutoSync.OnInsert )]
        public int Id { get; set; }
        [Column]
        public StatType Type { get; set; }
        [Column]
        public int ItemId { get; set; }
        [Column]
        public float Value { get; set; }
        [Column]
        public DateTime DateTime { get; set; }
 
        public string DateTimeNormal { get { return DateTime.ToShortDateString(); } }
    }

I'm using MVVM for my app and have the following property in my ViewModel:
public ObservableCollection<StatItem> BodyParameters

On my page, i have the following XAML code:
<chart:RadCartesianChart x:Name="chart" Height="200"
                         Margin="7">
    <chart:RadCartesianChart.HorizontalAxis>
        <chart:LinearAxis/>
    </chart:RadCartesianChart.HorizontalAxis>
 
    <chart:RadCartesianChart.VerticalAxis>
        <chart:LinearAxis/>
    </chart:RadCartesianChart.VerticalAxis>
 
    <!--<chart:RadCartesianChart x:Name="BodyParamChart"
                         Height="200"
                         Margin="7"
 
                         AxisForeground="White"
                         Background="SteelBlue"
                         FontSize="11"
                         CategoryValueMemberPath="DateTimeNormal"
                         GridStroke="Transparent"
                         IsEnabled="False"
                         DataSource="{Binding BodyParameters}"
                         PlotAreaBackground="SteelBlue">-->
 
 
    <chart:RadCartesianChart.Series>
        <chart:LineSeries Path=Statistics}" x:Name="BodyParamChart" Stroke="Orange" ValueBinding="Value" CategoryBinding="DateTimeNormal" ItemsSource="{Binding BodyParameters}" StrokeThickness="2">
        </chart:LineSeries>
    </chart:RadCartesianChart.Series>
</chart:RadCartesianChart>
And as a result I have the attached screenshot. I'm pretty sure, that that my data is OK, because I was using the other chart component with it. Maybe, I just misunderstand something about your chart component?

5 Answers, 1 is accepted

Sort by
0
Ivan
Top achievements
Rank 1
answered on 01 Jul 2014, 10:38 AM
Don't know how to edit posts, so here is the correct xaml:
<chart:RadCartesianChart x:Name="chart" Height="200"
                         Margin="7">
    <chart:RadCartesianChart.HorizontalAxis>
        <chart:LinearAxis/>
    </chart:RadCartesianChart.HorizontalAxis>
 
    <chart:RadCartesianChart.VerticalAxis>
        <chart:LinearAxis/>
    </chart:RadCartesianChart.VerticalAxis>
 
    <!--<chart:RadCartesianChart x:Name="BodyParamChart"
                         Height="200"
                         Margin="7"
 
                         AxisForeground="White"
                         Background="SteelBlue"
                         FontSize="11"
                         CategoryValueMemberPath="DateTimeNormal"
                         GridStroke="Transparent"
                         IsEnabled="False"
                         DataSource="{Binding BodyParameters}"
                         PlotAreaBackground="SteelBlue">-->
 
 
    <chart:RadCartesianChart.Series>
        <chart:LineSeries x:Name="BodyParamChart" Stroke="Orange" ValueBinding="Value" CategoryBinding="DateTimeNormal" ItemsSource="{Binding BodyParameters}" StrokeThickness="2">
        </chart:LineSeries>
    </chart:RadCartesianChart.Series>
</chart:RadCartesianChart>

0
Ivan
Top achievements
Rank 1
answered on 03 Jul 2014, 04:14 AM
Anybody?
0
Rosy Topchiyska
Telerik team
answered on 03 Jul 2014, 10:34 AM
Hi Ivan,

Thank you for the question.

The problem is that you try to plot categorical data on a chart with two linear axes. If you set the RadCartesianChart.HorizontalAxis to CategoricalAxis, then the data will be visualized. You can also use DateTimeCategoricalAxis or DateTimeContinuousAxis if you wish to set the CategoryBinding of the LineSeries directly to a property of type DateTime.

I hope this helps. Please, let us know if you have further questions.

Regards,
Rosy Topchiyska
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Ivan
Top achievements
Rank 1
answered on 04 Jul 2014, 04:23 AM
Thank you. Now I have another problem. I have two or more value change on one DateTime. But when I display them, it shows only one horizontal value. I've attached file. 

<chart:RadCartesianChart.HorizontalAxis>
<chart:DateTimeCategoricalAxis/>
</chart:RadCartesianChart.HorizontalAxis>

P.S. Maybe there is a reference link for all methods and properties? I'm feeling very noobie. =)
0
Rosy Topchiyska
Telerik team
answered on 08 Jul 2014, 12:21 PM
Hi Ivan,

Here is a link to the API reference of the DateTimeCategoricalAxis, in the See Also section you can find a link with all members of the class. You have to set the DateTimeCategoricalAxis.DateTimeComponent property that will be used to to group the data points in categories by the specified component. If you do not wish to group the points, but display them as on a numerical axis, then you can use the DateTimeContinuousAxis.

I hope this is useful. Please, let us know if you have further questions.

Regards,
Rosy Topchiyska
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Chart
Asked by
Ivan
Top achievements
Rank 1
Answers by
Ivan
Top achievements
Rank 1
Rosy Topchiyska
Telerik team
Share this question
or