WPF Chart binding error - wpf

i have problem to correctly bind data to WPF Chart. When i'm setting ItemsSource i get error:
Assigned dependent axis cannot be used. The data may not be able to be rendered on the provided axis or the series may require that they axis has an origin.
oc = new ObservableCollection<Pair>();
heartBeats.ItemsSource = oc;
to Pair i'm saving int and long
XAML:
...
xmlns:charting="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit" >
<charting:Chart x:Name="ApplicatioChart">
<charting:Chart.Series>
<charting:ColumnSeries x:Name="heartBeats" Title="Working Set"
DependentValueBinding="{Binding First}" IndependentValueBinding="{Binding Second}" >
<charting:ColumnSeries.IndependentAxis>
<charting:CategoryAxis Orientation="X" />
</charting:ColumnSeries.IndependentAxis>
<charting:ColumnSeries.DependentRangeAxis>
<charting:LinearAxis Orientation="Y" />
</charting:ColumnSeries.DependentRangeAxis>
</charting:ColumnSeries>
</charting:Chart.Series>
</charting:Chart>
Please help.. :(

i resolved it this way:
<charting:Chart Title="Engine Performance" x:Name="ApplicationChart">
<!-- Power curve -->
<charting:LineSeries x:Name="heartBeats"
Title="ManagedHeapSize"
IndependentValueBinding="{Binding EventTime}"
DependentValueBinding="{Binding ManagedHeapSize}">
<!-- Vertical axis -->
<charting:LineSeries.DependentRangeAxis>
<charting:LinearAxis
Orientation="Y"
Title="ManagedHeapSize"
Interval="10000000" Focusable="True"
ShowGridLines="True"/>
</charting:LineSeries.DependentRangeAxis>
</charting:LineSeries>
<charting:Chart.Axes>
<!-- Shared horizontal axis -->
<charting:LinearAxis
Orientation="X"
Title="EventTime"
Interval="100"
ShowGridLines="True"/>
</charting:Chart.Axes>
</charting:Chart>

Can't see anything wrong with the mark up (apart from the same Property being bound as both the dependent and independent value).
It seems to work fine in the Silverlight version, I don't have the WPF version to play with.
Try removing the definition for the DependentRangeAxis, to see whether it works with the default one.

Related

Using BindingContext within Border (C# MAUI, appliable to Xamarin/WPF)

I've been struggling with getting Binding to work within a Border. When I try to bind something outside the Border, it works wonderfully, but I can't get it to work within the Border.
Code here of what works:
<DataTemplate x:Key="TaskTemplate">
<GridLayout
ColumnDefinitions="*"
>
<Label Text={Binding Path=TestText}/>
</GridLayout>
</DataTemplate>
This code displays the text properly.
What does not and what I need to get to work:
<DataTemplate x:Key="TaskTemplate">
<GridLayout
ColumnDefinitions="*"
>
<Border
GridLayout.Column="0"
BackgroundColor="{StaticResource MidBackgroundColor}"
StrokeThickness="1"
Stroke="Transparent"
HorizontalOptions="Center">
<Border.StrokeShape>
<RoundRectangle CornerRadius="30"/>
</Border.StrokeShape>
<Label
Text="{Binding Path=TestText}"/>
</Border>
</GridLayout>
</DataTemplate>
This code shows it as empty.
From what I've understood so far, the Border takes away the Context and I've tried numerous things off of other threads to get it to work, but since I'm quite new, I'm struggling to find out how it works exactly.
Thanks in advance!
EDIT:
I've already tried replacing the Binding with plain text and that works just fine, so it's not that a Label within a Border would be invisible.
I want to clarify that the aforementioned Text property is not actually the Label's or Border's Text property, but a Text property of a bounded object. Renamed it for clarity above to TestText.
This code shows proper text:
<GridLayout
ColumnDefinitions="*"
>
<Border
GridLayout.Column="0"
BackgroundColor="{StaticResource MidBackgroundColor}"
StrokeThickness="1"
Stroke="Transparent"
HorizontalOptions="Center">
<Border.StrokeShape>
<RoundRectangle CornerRadius="30"/>
</Border.StrokeShape>
<Label
Text="Testing text."/>
</Border>
</GridLayout>
</DataTemplate>
The desired result is this: https://i.stack.imgur.com/wUdGD.jpg
But instead of the hard-coded text, it should Bind text of another object. This shouldn't be an issue of other code, since it works just fine if I write the code outside the Border.
EDIT2:
Including all the other code.
This is the Page that displays everything.
TasksPage.xaml:
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
<ContentPage.Resources>
<ResourceDictionary Source="/Views/ViewTask.xaml"/>
</ContentPage.Resources>
<GridLayout RowDefinitions="*">
<GridLayout
GridLayout.Row="0"
HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand">
<StackLayout Margin="5,5,5,0">
<CollectionView x:Name="TasksCollection"
ItemsSource="{Binding Tasks}"
ItemTemplate="{StaticResource TaskTemplate}">
</CollectionView>
</StackLayout>
</GridLayout>
</GridLayout>
</ContentPage>
TasksPage.xaml.cs:
public partial class TasksPage : ContentPage
{
public TasksPage()
{
InitializeComponent();
BindingContext = new TaskViewModel();
}
}
This is the itemtemplate for that collection.
ViewTask.xaml:
<ResourceDictionary xmlns="http://schemas.microsoft.com/dotnet/2021/maui" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
<DataTemplate x:Key="TaskTemplate">
<GridLayout
ColumnDefinitions="*">
<Border
GridLayout.Column="0"
BackgroundColor="{StaticResource MidBackgroundColor}"
StrokeThickness="1"
Stroke="Transparent"
HorizontalOptions="Center">
<Border.StrokeShape>
<RoundRectangle CornerRadius="30"/>
</Border.StrokeShape>
<Label GridLayout.Column="0"
GridLayout.Row="0"
Text="{Binding TaskText}" />
</Border>
</GridLayout>
</DataTemplate>
</ResourceDictionary>
The ViewModel just has an ObservableCollection, which works just fine. So all the items actually populate the DataTemplate, it's just that the DataTemplate only shows Binded properties if it's not within a Border.
Someone else has also seen this as a bug. Lester Moreno's comment on blog announcing maui preview 9.
For now, you can simulate Border by using "Frame-inside-Frame":
<!-- Without Grid, the Frame takes the whole width. -->
<!-- To have multiple buttons in one row, use more Grid columns. -->
<!-- Border will be more convenient once it works. -->
<Grid ColumnDefinitions="Auto,*">
<!-- "Padding 6" of outer frame determines how thick the Border color is. -->
<Frame HasShadow="False" CornerRadius="18" Padding="6" BackgroundColor="#F69927">
<!-- "Padding 2" of inner frame is white space surrounding the label. -->
<Frame HasShadow="False" CornerRadius="12" BackgroundColor="White" Padding="6,2">
<Label Text="{Binding LabelText}" VerticalTextAlignment="Center" HorizontalTextAlignment="Center"
TextColor="Blue"/>
</Frame>
</Frame>
</Grid>

WPF DVC Chart axis labeling

I have created a DVC:Chart as shown below in my code, how do i add x-axis and y-axis labels to the chart?
<DVC:Chart Name="callLogs"
Background="SteelBlue" Grid.ColumnSpan="2">
<DVC:Chart.Series>
<DVC:ColumnSeries Title="Calls per Hour"
IndependentValueBinding="{Binding Path=Key}"
DependentValueBinding="{Binding Path=Value}">
</DVC:ColumnSeries>
</DVC:Chart.Series>
</DVC:Chart>
Thanks in advance
I have managed to figure it out:
<DVC:Chart Name="callLogs"
Background="SteelBlue" Grid.ColumnSpan="2">
<DVC:Chart.Axes>
<DVC:LinearAxis Orientation="Y" Title="Ammount of calls"/>
<DVC:LinearAxis Orientation="X" Title="Time (Hours)"/>
</DVC:Chart.Axes>
<DVC:Chart.Series>
<DVC:ColumnSeries Title="Calls per Hour"
IndependentValueBinding="{Binding Path=Key}"
DependentValueBinding="{Binding Path=Value}">
</DVC:ColumnSeries>
</DVC:Chart.Series>
</DVC:Chart>
However, its labeling my x-axis for me, don't know how to customize it, so i will post the new solution when i figure it out.

How can you set the horizontal axis interval in a WPF Toolkit Chart Control?

I'm using the chart control from the WPF Toolkit. How can I set the interval of the X axis?
I have the following XAML code:
<Grid Height="800">
<chartingToolkit:Chart Name="lineChart" Title="Pressure over Time"
VerticalAlignment="Top" Margin="20,50,20,0" Height="500">
<chartingToolkit:Chart.Axes>
<chartingToolkit:LinearAxis Title="Pressure" Orientation="Y" Interval="100" />
<chartingToolkit:LinearAxis Title="Time" Orientation="X" Interval="100" />
</chartingToolkit:Chart.Axes>
<chartingToolkit:LineSeries DependentValuePath="Value" IndependentValuePath="Key" ItemsSource="{Binding}" Name="Test"
IsSelectionEnabled="True" ClipToBounds="False">
</chartingToolkit:LineSeries>
</chartingToolkit:Chart>
<Button Width="100" Height="24" Margin="20,556,1058,220" Content="More" Name="Button1" />
</Grid>
The Y Axis works fine, it shows the interval of 100 but the X axis puts itself on the top (please see the added image) and the interval is the exact amounts of points. Why doesnt it listen to the Interval="100" property in the xaml? And why doesn't it place itself on the bottom?
For the location of the linearAxis, you can set the Location property to "Bottom"
in code:
<chartingToolkit:LinearAxis Title="Time" Orientation="X" Interval="100"
Location="Bottom" />
For the interval problem, i don't know...

Silverlight ToolKit Chart: Hide xaxis labels

Basically I have a chart with multiple bar series. The independent value for all the series are the same. So the chart's xaxes are rendered with stacked of same independent values.
If I want to make all series (except for the first one) xaxes' labels to not visible, how can i do that in the xaml declaration?
Can anyone please give me assistance on this?
Update:
I have come across example with the following code:
<toolkit:Chart x:Name="myChart" Width="600" Height="400">
<toolkit:LineSeries
Title="Tasks"
ItemsSource="{Binding}"
IndependentValueBinding="{Binding Month}"
DependentValueBinding="{Binding Task}">
</toolkit:LineSeries>
<toolkit:LineSeries
Title="Benefits"
ItemsSource="{Binding}"
IndependentValueBinding="{Binding Month}"
DependentValueBinding="{Binding Benefits}">
</toolkit:LineSeries>
<toolkit:Chart.Axes>
<toolkit:LinearAxis Orientation="Y" Location="Left" Title="First" />
<toolkit:LinearAxis Orientation="Y" Location="Right" Title="Second" />
</toolkit:Chart.Axes>
</toolkit:Chart>
If you plot the above code, you will see that both series will base the Y values from the left one. How can we change it so that first series will be plotted against Y values on the left and second series to be plotted against Y values on the right.
is that possible?
Thanks.
I think you can achieve what you want using the DependentRangeAxis properties of the LineSeries objects.
First, give each Y-axis an x:Name, for example TaskAxis and BenefitsAxis.
Then, you can tell a LineSeries to use an axis by adding to it the property
DependentRangeAxis="{Binding ElementName=TaskAxis}"
or
DependentRangeAxis="{Binding ElementName=BenefitsAxis}"
as appropriate.
The full XAML of the chart then becomes
<toolkit:Chart x:Name="myChart" Width="600" Height="400">
<toolkit:LineSeries
Title="Tasks"
ItemsSource="{Binding Path=Data1}"
IndependentValueBinding="{Binding Month}"
DependentValueBinding="{Binding Task}"
DependentRangeAxis="{Binding ElementName=TaskAxis}">
</toolkit:LineSeries>
<toolkit:LineSeries
Title="Benefits"
ItemsSource="{Binding Path=Data1}"
IndependentValueBinding="{Binding Month}"
DependentValueBinding="{Binding Benefits}"
DependentRangeAxis="{Binding ElementName=BenefitsAxis}">
</toolkit:LineSeries>
<toolkit:Chart.Axes>
<toolkit:LinearAxis Orientation="Y" Location="Left" Title="First" x:Name="TaskAxis" />
<toolkit:LinearAxis Orientation="Y" Location="Right" Title="Second" x:Name="BenefitsAxis" />
</toolkit:Chart.Axes>
</toolkit:Chart>
Another approach is to move the Axis objects inside the LineSeries. A demonstration of how to do this can be found here.

RibbonGroupsPanel ... accepts only IProvideStarLayoutInfo instances?

I am trying to use a RibbonGallery in my application, but I get this error at runtime, when the tab which contains the gallery is loaded:
"RibbonGroupsPanel RegisterStarLayoutProvider and
UnregisterStarLayoutProvider accepts only IProvideStarLayoutInfo
instances. Parameter name: starLayoutInfoProvider"
Any idea what isn't right?
Here's the code:
<ribbon:RibbonGallery MaxColumnCount="1">
<ribbon:RibbonGalleryCategory>
<ribbon:RibbonGalleryItem Content="Green" Foreground="Green" />
<ribbon:RibbonGalleryItem Content="Blue" Foreground="Blue" />
<ribbon:RibbonGalleryItem Content="Orange" Foreground="Orange" />
</ribbon:RibbonGalleryCategory>
</ribbon:RibbonGallery>
The RibbonGallery control must be placed within a control that can take advantage of the RibbonGallery, like a RibbonSplitButton or a RibbonComboBox. Here is an example of using a gallery in a RibbonComboBox:
<ribbon:RibbonComboBox Label="1"
SmallImageSource="Images/RightArrowShort_Green16.png"
SelectionBoxWidth="62"
VerticalAlignment="Center"
IsEditable="True" >
<ribbon:RibbonGallery SelectedValue="Green"
SelectedValuePath="Content"
MaxColumnCount="1">
<ribbon:RibbonGalleryCategory>
<ribbon:RibbonGalleryItem Content="Green" Foreground="Green" />
<ribbon:RibbonGalleryItem Content="Blue" Foreground="Blue" />
<ribbon:RibbonGalleryItem Content="Orange" Foreground="Orange" />
</ribbon:RibbonGalleryCategory>
</ribbon:RibbonGallery>
</ribbon:RibbonComboBox>
XAML copied from http://msdn.microsoft.com/en-us/library/microsoft.windows.controls.ribbon.ribbongallery.aspx.
If a control is derived from RibbonMenuButton then it can contain a RibbonGallery because of the HasRibbon property.
The RibbonMenuItemsPanel-class of the System.Windows.Controls.Ribbon.Primitives allows to place a RibbonGallery in a RibbonGroup. This class implements the ISupportStarLayout-interface.
Define the primitives-Namespace in the Window-element (could also be RibbonWindow):
<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:shell="http://schemas.microsoft.com/winfx/2006/xaml/presentation/shell"
xmlns:primitives="clr-namespace:System.Windows.Controls.Ribbon.Primitives;assembly=System.Windows.Controls.Ribbon"
... >
The RibbonGroup-part:
<RibbonGroup Header="MyRibbonGroup">
<primitives:RibbonMenuItemsPanel Margin="0,3,0,0">
<RibbonGallery ...>
<RibbonGalleryCategory ...>
...
</RibbonGalleryCategory>
</RibbonGallery>
</primitives:RibbonMenuItemsPanel>
</RibbonGroup>
Note that i use the System.Windows.Controls.Ribbon-namespace (.Net 4.5) and not the Microsoft.Windows.Controls.Ribbon-namespace. But this should be nearly the same.
I don't see any RibbonGroupsPanel in your xaml which leads me to thinking that you're not showing all of the relevant xaml.
In any case, it tells you that you're putting the wrong element inside RibbonGroupsPanel.RegisterStarLayoutProvider and that it accepts only types that implements IProvideStarLayoutInfo .

Resources