Hi,
I am use an example where the XamDataChart is a control that can be used in win forms. In the example the x Axis does not show. I am not sure how the styling functions work. How do I display the x Axis and format it to DateTime and set the interval to daily.
Thanks
Pieter
Ok I got this to work, in the samples on the web they show that we must use a CategoryXAxis and just format the label as date time, in my DataContext the X Axis is already a DateTime field then this solution does not work. I change it to CategoryDateTimeXAxis and format the label the way I want it. It works now but now I have a new problem when you Zoom in is cutting of the trace, not sure way but I think its something to do with the intervals of the X Axis, It’s not making the intervals smaller when I zoom. I don’t know how to set the intervals on the CategoryDateTimeXAxis.
I am not getting any response on my other posts hope someone will respond on this one.
Thanks,
Pieter,
Unfortunately the Interval on the CategoryDateTimeXAxis is not currently user configurable. But you should see each gridline represent a smaller interval as you zoom in, from my understanding. You can use the CategoryXAxis to display datetime types but they will only be treated as strings, so they won't be further subdivided as you zoom. You will see labels that might have been hidden from further out, but the labels will always exactly corellate with the values on the actual items.
It feels like it was potentially an oversight rather than a deferral that the interval of the CategoryDateTimeXAxis is not configurable, so I've created a bug report to try and sort that out (Bug 36850).
You can also see this post for into about how you can use the NumericXAxis to have greater control over the intervals in the meantime. http://community.infragistics.com/forums/p/41666/244821.aspx#244821
But note there are various benefits and trade-offs to working with numeric axes vs. category axes. If you can share a sample and more information as to how you want it to look I may be able to further advise you how to achieve your goal.
-Graham
Hi Graham,
Thanks for the reply, I almost thought you guys bailed.
See the image below where I try to zoom, and then the second image is my results of the zoom.
If I use the mouse wheel and roll it back a couple of times I get the third image. I cannot send you the source code but I can give some snippets. I am using the CategoryDateTimeXAxis and I am getting the X values out of a SQL database and it’s a datetime field. The X intervals are changing (or subdividing), but something is going wrong on the display of the chart. You can see Figure 2 and 3.
I am adding the Xaml code, it’s a bit messy, it’s a couple of samples mixed.
<UserControl x:Class="XamDataChartControl.XamDataChartHostControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:igChart="clr-namespace:Infragistics.Windows.DataChart;assembly=Infragistics.Windows.DataVisualization.DataChart.v10.1"
xmlns:igCtrl="clr-namespace:Infragistics.Windows.Controls;assembly=Infragistics.Windows.DataVisualization.Controls.v10.1"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d">
<UserControl.Resources>
<LinearGradientBrush x:Key="rscGradientBackground" StartPoint="0.0, 0.0" EndPoint="1.0, 1.0">
<GradientStop Color="#FFFFFFFF" Offset="0" />
<GradientStop Color="#c0c2c8" Offset="0.4" />
<GradientStop Color="#e0e2e8" Offset="1" />
</LinearGradientBrush>
<Style x:Key="rscXamDataChartStyle" TargetType="igChart:XamDataChart">
<Setter Property="PlotAreaBackground" Value="Transparent" />
</Style>
<Style x:Key="LegendStyle" TargetType="{x:Type igChart:Legend}">
<Setter Property="Background">
<Setter.Value>
<LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
<GradientStop Color="White" Offset="0" />
<GradientStop Color="White" Offset="0.5" />
<GradientStop Color="#FFE8E8EF" Offset="1" />
</Setter.Value>
</Setter>
<Setter Property="BorderBrush" Value="{DynamicResource rscGradientBorder}"/>
<Setter Property="BorderThickness" Value="0.75" />
<Setter Property="Orientation" Value="Vertical" />
<Setter Property="Padding" Value="4" />
<Setter Property="Margin" Value="2" />
<Setter Property="Template">
<ControlTemplate TargetType="{x:Type igChart:Legend}">
<Grid Margin="{TemplateBinding Margin}">
<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="3" Background="Transparent" CornerRadius="4">
<Grid Margin="{TemplateBinding Padding}">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<ContentPresenter Content="{TemplateBinding Content}" Margin="0" Grid.Row="1" />
<ScrollViewer BorderThickness="0" HorizontalScrollBarVisibility="Auto" Grid.Row="2" VerticalScrollBarVisibility="Auto" Margin="3,0,0,0">
<ContentPresenter x:Name="ContentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" Grid.Row="1" />
</ScrollViewer>
</Grid>
</Border>
<Border BorderBrush="Transparent" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="4" IsHitTestVisible="False">
<Border.Background>
<LinearGradientBrush EndPoint="0,1" Opacity="0" StartPoint="0,0">
<GradientStop Color="Transparent" Offset="0" />
<GradientStop Color="#10FFFFFF" Offset="0.499" />
<GradientStop Color="Transparent" Offset="0.501" />
</Border.Background>
</ControlTemplate>
<LinearGradientBrush x:Key="rscGradientBorder" StartPoint="0.0, 0.0" EndPoint="0.0, 1.0">
<GradientStop Color="#c0c2c8" Offset="0.75" />
</UserControl.Resources>
<igChart:XamDataChart x:Name="xmDataChart" Grid.Row="1" Style="{StaticResource rscXamDataChartStyle}"
Legend="{Binding ElementName=Legend}" GridMode="BehindSeries" PlotAreaBackground="White" PlotAreaBorderThickness="1" DataContext="{Binding}" OverridesDefaultStyle="False">
<igChart:Legend igCtrl:XamDock.Edge="OutsideRight" x:Name="Legend"
Style="{DynamicResource LegendStyle}"
igCtrl:XamDock.VerticalAlignment="Center" />
<igChart:XamDataChart.Axes>
<igChart:CategoryDateTimeXAxis x:Name="XAxis" ItemsSource="{Binding}" DateTimeMemberPath="Column0" Label="{}{}" MajorStroke="Black" >
<igChart:CategoryDateTimeXAxis.LabelSettings>
<igChart:AxisLabelSettings Location="OutsideBottom" Extent="30"/>
</igChart:CategoryDateTimeXAxis.LabelSettings>
</igChart:CategoryDateTimeXAxis>
<igChart:NumericYAxis x:Name="YAxis" Label=" {} " MajorStroke="Black">
<igChart:NumericYAxis.LabelSettings >
<igChart:AxisLabelSettings Location="OutsideLeft" Extent="55"/>
</igChart:NumericYAxis.LabelSettings>
</igChart:NumericYAxis>
<igChart:NumericYAxis x:Name="Y2Axis" Label=" {} " MajorStroke="Black" >
<igChart:AxisLabelSettings Location="OutsideRight" Extent="60"/>
<igChart:NumericYAxis x:Name="Y3Axis" Label=" {} " MaximumValue="3" MinimumValue="1" MajorStroke="Black">
<igChart:AxisLabelSettings Location="OutsideLeft" Extent="50" />
</igChart:XamDataChart.Axes>
<igChart:XamDataChart.Series>
Are you using the latest service release? There were a few issues with that axis that we resolved that could have something to do with the zoom behavior you are expreriencing, but I haven't seen this particular problem manifest itself before, so its a bit hard to identify the root cause from the screenshots. Also, just so we know, which series type is that?
Hello Pieter,
I have created a support ticket on your behalf with number: CAS-52054-GHT6C8
You can follow on it from our website: https://ko.infragistics.com/Membership/MySupport.aspx
Sincerely,
Petar Monov
Developer Support Engineer
Infragistics Bulgaria
www.infragistics.com/support
I've forwarded this to developer support so that they can help extract enough information to replicate the situation here. How does the data look for the chart at the beginning and the end of the triangle? Is there a lot of data for a short period of time at the beginning of the triangle with a large range of y values, and then a long gap with no values, and then another value?
If there is a lot of range in the y values then at zoomed out views you will see the line as a filled area that represents the range of values at that point, and then it will resolve into the actual line as you zoom in.
Because you have a long period of time with no values, it's possible that the ranged shape is just being attenuated toward the next value in the series. Is that what the data looks like? If you would like to have a discontinuity in your line where a discontinutity in the data exists, you could insert a double.NaN value in the series before each long pause of no values.
Do you have any feedback on this post?
Can you maybe tell me why the tool is filling (making this red triangle) when there are no data for a period of time?
Thank You,
It will be a bit difficult to replicate the data on a sample project, I will have to send you the database. I think it’s defiantly something to do with the date format from SQL. When I limit my query to the last 48 hours the zoom function is working fine.
The data is coming in every minute.
I did try to use Category X Axis with the label setting you show but still no change.
Will it be possible for you to use TeamViewer and log onto my PC and take a look at the problem maybe I just have the wrong version or it’s something small.
If we can’t do that can you give me FTP details then I will give you the database and project.
My trail is going to expire at the end of this week and I need to give my boss the go ahead on this tool.
Are you able to replicate the issue in a sample project? If not we'll have to try and replicate this issue here, but I'm not sure how dependent the problem is on the shape of your data, or the frequency of the values.
What kind of volume is bound to the chart there? If it is time data, what is the frequency of the values? Even intervals or random?
How are you trying to set the label for the CategoryXAxis? If the property with your datetime is called Date then do something like this:
Label="{}{Date}"
or Label="{}{Date:hh:mm:ss}"
for example.