Skip to content

Commit

Permalink
Merge pull request #1 from SyncfusionExamples/How-to-display-X-and-Y-…
Browse files Browse the repository at this point in the history 
…values-of-trackball-moving-trace-in-Labels-in-.NET-MAUI-Cartesian-Chart-sample

Added KB sample - How to display X and Y values of trackball moving trace in Labels in .NET MAUI Cartesian Chart
  • Loading branch information
@Saravanan-Madhesh
Saravanan-Madhesh authored Oct 29, 2024
2 parents c05a016 + 04575f3 commit 85b597e
Show file tree
Hide file tree
Showing 39 changed files with 1,483 additions and 2 deletions.
27 changes: 27 additions & 0 deletions DisplayTrackballValues/DisplayTrackballValues.sln
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@

Microsoft Visual Studio Solution File, Format Version 12.00
# Visual Studio Version 17
VisualStudioVersion = 17.10.35027.167
MinimumVisualStudioVersion = 10.0.40219.1
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "DisplayTrackballValues", "DisplayTrackballValues\DisplayTrackballValues.csproj", "{CBDBBD45-3C8E-42A5-A282-D1AFC1E0861D}"
EndProject
Global
GlobalSection(SolutionConfigurationPlatforms) = preSolution
Debug|Any CPU = Debug|Any CPU
Release|Any CPU = Release|Any CPU
EndGlobalSection
GlobalSection(ProjectConfigurationPlatforms) = postSolution
{CBDBBD45-3C8E-42A5-A282-D1AFC1E0861D}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
{CBDBBD45-3C8E-42A5-A282-D1AFC1E0861D}.Debug|Any CPU.Build.0 = Debug|Any CPU
{CBDBBD45-3C8E-42A5-A282-D1AFC1E0861D}.Debug|Any CPU.Deploy.0 = Debug|Any CPU
{CBDBBD45-3C8E-42A5-A282-D1AFC1E0861D}.Release|Any CPU.ActiveCfg = Release|Any CPU
{CBDBBD45-3C8E-42A5-A282-D1AFC1E0861D}.Release|Any CPU.Build.0 = Release|Any CPU
{CBDBBD45-3C8E-42A5-A282-D1AFC1E0861D}.Release|Any CPU.Deploy.0 = Release|Any CPU
EndGlobalSection
GlobalSection(SolutionProperties) = preSolution
HideSolutionNode = FALSE
EndGlobalSection
GlobalSection(ExtensibilityGlobals) = postSolution
SolutionGuid = {3FE2B269-B05B-4E5A-BE28-C1D888F7C384}
EndGlobalSection
EndGlobal
14 changes: 14 additions & 0 deletions DisplayTrackballValues/DisplayTrackballValues/App.xaml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
<?xml version = "1.0" encoding = "UTF-8" ?>
<Application xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:DisplayTrackballValues"
x:Class="DisplayTrackballValues.App">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Resources/Styles/Colors.xaml" />
<ResourceDictionary Source="Resources/Styles/Styles.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
</Application>
12 changes: 12 additions & 0 deletions DisplayTrackballValues/DisplayTrackballValues/App.xaml.cs
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
namespace DisplayTrackballValues
{
public partial class App : Application
{
public App()
{
InitializeComponent();

MainPage = new AppShell();
}
}
}
14 changes: 14 additions & 0 deletions DisplayTrackballValues/DisplayTrackballValues/AppShell.xaml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
<?xml version="1.0" encoding="UTF-8" ?>
<Shell
x:Class="DisplayTrackballValues.AppShell"
xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:DisplayTrackballValues"
Shell.FlyoutBehavior="Disabled"
Title="DisplayTrackballValues">

<ShellContent
ContentTemplate="{DataTemplate local:MainPage}"
Route="MainPage" />

</Shell>
10 changes: 10 additions & 0 deletions DisplayTrackballValues/DisplayTrackballValues/AppShell.xaml.cs
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
namespace DisplayTrackballValues
{
public partial class AppShell : Shell
{
public AppShell()
{
InitializeComponent();
}
}
}
66 changes: 66 additions & 0 deletions DisplayTrackballValues/DisplayTrackballValues/DisplayTrackballValues.csproj
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
<Project Sdk="Microsoft.NET.Sdk">

<PropertyGroup>
<TargetFrameworks>net8.0-android;net8.0-ios;net8.0-maccatalyst</TargetFrameworks>
<TargetFrameworks Condition="$([MSBuild]::IsOSPlatform('windows'))">$(TargetFrameworks);net8.0-windows10.0.19041.0</TargetFrameworks>
<!-- Uncomment to also build the tizen app. You will need to install tizen by following this: https://github.com/Samsung/Tizen.NET -->
<!-- <TargetFrameworks>$(TargetFrameworks);net8.0-tizen</TargetFrameworks> -->

<!-- Note for MacCatalyst:
The default runtime is maccatalyst-x64, except in Release config, in which case the default is maccatalyst-x64;maccatalyst-arm64.
When specifying both architectures, use the plural <RuntimeIdentifiers> instead of the singular <RuntimeIdentifier>.
The Mac App Store will NOT accept apps with ONLY maccatalyst-arm64 indicated;
either BOTH runtimes must be indicated or ONLY macatalyst-x64. -->
<!-- For example: <RuntimeIdentifiers>maccatalyst-x64;maccatalyst-arm64</RuntimeIdentifiers> -->

<OutputType>Exe</OutputType>
<RootNamespace>DisplayTrackballValues</RootNamespace>
<UseMaui>true</UseMaui>
<SingleProject>true</SingleProject>
<ImplicitUsings>enable</ImplicitUsings>
<Nullable>enable</Nullable>

<!-- Display name -->
<ApplicationTitle>DisplayTrackballValues</ApplicationTitle>

<!-- App Identifier -->
<ApplicationId>com.companyname.displaytrackballvalues</ApplicationId>

<!-- Versions -->
<ApplicationDisplayVersion>1.0</ApplicationDisplayVersion>
<ApplicationVersion>1</ApplicationVersion>

<SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'ios'">11.0</SupportedOSPlatformVersion>
<SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'maccatalyst'">13.1</SupportedOSPlatformVersion>
<SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'android'">21.0</SupportedOSPlatformVersion>
<SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'windows'">10.0.17763.0</SupportedOSPlatformVersion>
<TargetPlatformMinVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'windows'">10.0.17763.0</TargetPlatformMinVersion>
<SupportedOSPlatformVersion Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'tizen'">6.5</SupportedOSPlatformVersion>
</PropertyGroup>

<ItemGroup>
<!-- App Icon -->
<MauiIcon Include="Resources\AppIcon\appicon.svg" ForegroundFile="Resources\AppIcon\appiconfg.svg" Color="#512BD4" />

<!-- Splash Screen -->
<MauiSplashScreen Include="Resources\Splash\splash.svg" Color="#512BD4" BaseSize="128,128" />

<!-- Images -->
<MauiImage Include="Resources\Images\*" />
<MauiImage Update="Resources\Images\dotnet_bot.png" Resize="True" BaseSize="300,185" />

<!-- Custom Fonts -->
<MauiFont Include="Resources\Fonts\*" />

<!-- Raw Assets (also remove the "Resources\Raw" prefix) -->
<MauiAsset Include="Resources\Raw\**" LogicalName="%(RecursiveDir)%(Filename)%(Extension)" />
</ItemGroup>

<ItemGroup>
<PackageReference Include="Microsoft.Maui.Controls" Version="8.0.92" />
<PackageReference Include="Microsoft.Maui.Controls.Compatibility" Version="8.0.92" />
<PackageReference Include="Microsoft.Extensions.Logging.Debug" Version="8.0.1" />
<PackageReference Include="Syncfusion.Maui.Charts" Version="*" />
</ItemGroup>

</Project>
134 changes: 134 additions & 0 deletions DisplayTrackballValues/DisplayTrackballValues/MainPage.xaml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,134 @@
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="DisplayTrackballValues.MainPage"
xmlns:chart="clr-namespace:Syncfusion.Maui.Charts;assembly=Syncfusion.Maui.Charts"
xmlns:local="clr-namespace:DisplayTrackballValues">

<ContentPage.BindingContext>
<local:ViewModel x:Name="viewModel"/>
</ContentPage.BindingContext>

<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="8*"/>
<ColumnDefinition Width="2*"/>
</Grid.ColumnDefinitions>

<chart:SfCartesianChart x:Name="chart" Grid.Column="0" TrackballCreated="chart_TrackballCreated">

<chart:SfCartesianChart.Title>
<Label Text="Sales Comparison" ></Label>
</chart:SfCartesianChart.Title>

<chart:SfCartesianChart.XAxes>
<chart:DateTimeAxis Interval="2" EdgeLabelsVisibilityMode="AlwaysVisible"/>
</chart:SfCartesianChart.XAxes>

<chart:SfCartesianChart.YAxes>
<chart:NumericalAxis/>
</chart:SfCartesianChart.YAxes>

<chart:SfCartesianChart.TrackballBehavior>
<chart:ChartTrackballBehavior ShowLabel="False"/>
</chart:SfCartesianChart.TrackballBehavior>

<chart:SfCartesianChart.Legend>
<chart:ChartLegend/>
</chart:SfCartesianChart.Legend>

<chart:LineSeries ItemsSource="{Binding ProductSalesDetails}"
x:Name="series1"
XBindingPath="Date"
YBindingPath="ProductASales"
StrokeWidth="3"
ShowTrackballLabel="True"
Label="Product A"
Fill="RoyalBlue"/>
<chart:LineSeries ItemsSource="{Binding ProductSalesDetails}"
x:Name="series2"
XBindingPath="Date"
YBindingPath="ProductBSales"
StrokeWidth="3"
ShowTrackballLabel="True"
Label="Product B"
Fill="HotPink"/>
<chart:LineSeries ItemsSource="{Binding ProductSalesDetails}"
x:Name="series3"
XBindingPath="Date"
YBindingPath="ProductCSales"
StrokeWidth="3"
ShowTrackballLabel="True"
Label="Product C"
Fill="Green"/>

</chart:SfCartesianChart>
<VerticalStackLayout Grid.Column="1" HorizontalOptions="Center">
<Label HorizontalOptions="Center" Text="Trackball Values" FontAttributes="Bold"/>
<VerticalStackLayout>
<Frame Background="LightBlue" CornerRadius="8" Margin="5" BorderColor="Gray">
<HorizontalStackLayout HorizontalOptions="Center" Spacing="10" VerticalOptions="Center" >
<Label x:Name="dateLabel1"
FontSize="14"
FontAttributes="Bold"
TextColor="Black"
VerticalOptions="Center"/>
<Label Text=" : "
FontSize="14"
FontAttributes="Bold"
TextColor="Black"
VerticalOptions="Center"/>
<Label x:Name="valueLabel1"
FontSize="14"
FontAttributes="Bold"
TextColor="Black"
VerticalOptions="Center"/>
</HorizontalStackLayout>
</Frame>
</VerticalStackLayout>
<VerticalStackLayout>
<Frame Background="Pink" CornerRadius="8" Margin="5" BorderColor="Gray">
<HorizontalStackLayout HorizontalOptions="Center" Spacing="10" VerticalOptions="Center" >
<Label x:Name="dateLabel2"
FontSize="14"
FontAttributes="Bold"
TextColor="Black"
VerticalOptions="Center"/>
<Label Text=" : "
FontSize="14"
FontAttributes="Bold"
TextColor="Black"
VerticalOptions="Center"/>
<Label x:Name="valueLabel2"
FontSize="14"
FontAttributes="Bold"
TextColor="Black"
VerticalOptions="Center"/>
</HorizontalStackLayout>
</Frame>
</VerticalStackLayout>
<VerticalStackLayout>
<Frame Background="LightGreen" CornerRadius="8" Margin="5" BorderColor="Gray">
<HorizontalStackLayout HorizontalOptions="Center" Spacing="10" VerticalOptions="Center" >
<Label x:Name="dateLabel3"
FontSize="14"
FontAttributes="Bold"
TextColor="Black"
VerticalOptions="Center"/>
<Label Text=" : "
FontSize="14"
FontAttributes="Bold"
TextColor="Black"
VerticalOptions="Center"/>
<Label x:Name="valueLabel3"
FontSize="14"
FontAttributes="Bold"
TextColor="Black"
VerticalOptions="Center"/>
</HorizontalStackLayout>
</Frame>
</VerticalStackLayout>
</VerticalStackLayout>
</Grid>

</ContentPage>
71 changes: 71 additions & 0 deletions DisplayTrackballValues/DisplayTrackballValues/MainPage.xaml.cs
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
using Syncfusion.Maui.Charts;

namespace DisplayTrackballValues
{
public partial class MainPage : ContentPage
{
public MainPage()
{
InitializeComponent();
}

private void chart_TrackballCreated(object sender, TrackballEventArgs e)
{
var items = e.TrackballPointsInfo;

foreach (var item in items)
{
var series = item.Series;

if (series == series1)
{
item.MarkerSettings = new ChartMarkerSettings()
{
Fill = Colors.DeepSkyBlue,
Width = 15,
Height = 15,
Stroke = Colors.RoyalBlue,
StrokeWidth = 3,
Type = ShapeType.InvertedTriangle
};

dateLabel1.SetBinding(Label.TextProperty, new Binding("Date") { Source = item.DataItem, StringFormat = "{0:dd/MM/yyyy}" });
valueLabel1.SetBinding(Label.TextProperty, new Binding("Label") { Source = item });
}

else if (series == series2)
{
item.MarkerSettings = new ChartMarkerSettings()
{
Fill = Colors.LightPink,
Width = 15,
Height = 15,
Stroke = Colors.HotPink,
StrokeWidth = 3,
Type = ShapeType.Cross
};

dateLabel2.SetBinding(Label.TextProperty, new Binding("Date") { Source = item.DataItem, StringFormat = "{0:dd/MM/yyyy}" });
valueLabel2.SetBinding(Label.TextProperty, new Binding("Label") { Source = item });
}

else if (series == series3)
{
item.MarkerSettings = new ChartMarkerSettings()
{
Fill = Colors.LightSeaGreen,
Width = 15,
Height = 15,
Stroke = Colors.Green,
StrokeWidth = 3,
Type = ShapeType.Diamond
};

dateLabel3.SetBinding(Label.TextProperty, new Binding("Date") { Source = item.DataItem, StringFormat = "{0:dd/MM/yyyy}" });
valueLabel3.SetBinding(Label.TextProperty, new Binding("Label") { Source = item });
}
}
}
}

}
27 changes: 27 additions & 0 deletions DisplayTrackballValues/DisplayTrackballValues/MauiProgram.cs
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
using Microsoft.Extensions.Logging;
using Syncfusion.Maui.Core.Hosting;

namespace DisplayTrackballValues
{
public static class MauiProgram
{
public static MauiApp CreateMauiApp()
{
var builder = MauiApp.CreateBuilder();
builder
.UseMauiApp<App>()
.ConfigureSyncfusionCore()
.ConfigureFonts(fonts =>
{
fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
});

#if DEBUG
builder.Logging.AddDebug();
#endif

return builder.Build();
}
}
}
Loading

0 comments on commit 85b597e

Please sign in to comment.