Skip to content

Commit

Permalink
Merge pull request #1 from SyncfusionExamples/TASK-878247_Sample_Prep…
Browse files Browse the repository at this point in the history 
…aration

TASK-878247 Creating a .NET MAUI Column Chart to Visualize the Corporate Investment in AI
  • Loading branch information
@SyncfusionKarthikeyan
SyncfusionKarthikeyan authored Mar 22, 2024
2 parents e4d4af5 + 26d298c commit 5d7a3b9
Show file tree
Hide file tree
Showing 41 changed files with 1,276 additions and 2 deletions.
27 changes: 27 additions & 0 deletions AIInvestingCompanies/AIInvestingCompanies.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.34607.79
MinimumVisualStudioVersion = 10.0.40219.1
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "AIInvestingCompanies", "AIInvestingCompanies\AIInvestingCompanies.csproj", "{84330AD7-7E18-47A2-A78A-9823888657A8}"
EndProject
Global
GlobalSection(SolutionConfigurationPlatforms) = preSolution
Debug|Any CPU = Debug|Any CPU
Release|Any CPU = Release|Any CPU
EndGlobalSection
GlobalSection(ProjectConfigurationPlatforms) = postSolution
{84330AD7-7E18-47A2-A78A-9823888657A8}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
{84330AD7-7E18-47A2-A78A-9823888657A8}.Debug|Any CPU.Build.0 = Debug|Any CPU
{84330AD7-7E18-47A2-A78A-9823888657A8}.Debug|Any CPU.Deploy.0 = Debug|Any CPU
{84330AD7-7E18-47A2-A78A-9823888657A8}.Release|Any CPU.ActiveCfg = Release|Any CPU
{84330AD7-7E18-47A2-A78A-9823888657A8}.Release|Any CPU.Build.0 = Release|Any CPU
{84330AD7-7E18-47A2-A78A-9823888657A8}.Release|Any CPU.Deploy.0 = Release|Any CPU
EndGlobalSection
GlobalSection(SolutionProperties) = preSolution
HideSolutionNode = FALSE
EndGlobalSection
GlobalSection(ExtensibilityGlobals) = postSolution
SolutionGuid = {F9207065-A4F4-4241-A752-27F39ED1B7D3}
EndGlobalSection
EndGlobal
82 changes: 82 additions & 0 deletions AIInvestingCompanies/AIInvestingCompanies/AIInvestingCompanies.csproj
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,82 @@
<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>AIInvestingCompanies</RootNamespace>
<UseMaui>true</UseMaui>
<SingleProject>true</SingleProject>
<ImplicitUsings>enable</ImplicitUsings>
<Nullable>enable</Nullable>

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

<!-- App Identifier -->
<ApplicationId>com.companyname.aiinvestingcompanies</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\artificialintelligence.png">
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
</MauiImage>
<MauiImage Update="Resources\Images\dotnet_bot.png" Resize="True" BaseSize="300,185" />
<MauiImage Update="Resources\Images\technology.png">
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
</MauiImage>

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

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

<ItemGroup>
<None Remove="Resources\Images\artificialintelligence.png" />
<None Remove="Resources\Images\technology.png" />
</ItemGroup>

<ItemGroup>
<PackageReference Include="Microsoft.Maui.Controls" Version="$(MauiVersion)" />
<PackageReference Include="Microsoft.Maui.Controls.Compatibility" Version="$(MauiVersion)" />
<PackageReference Include="Microsoft.Extensions.Logging.Debug" Version="8.0.0" />
<PackageReference Include="Syncfusion.Maui.Charts" Version="*" />
</ItemGroup>

<ItemGroup>
<Folder Include="Model\" />
<Folder Include="ViewModel\" />
</ItemGroup>

</Project>
14 changes: 14 additions & 0 deletions AIInvestingCompanies/AIInvestingCompanies/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:AIInvestingCompanies"
x:Class="AIInvestingCompanies.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 AIInvestingCompanies/AIInvestingCompanies/App.xaml.cs
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
namespace AIInvestingCompanies
{
public partial class App : Application
{
public App()
{
InitializeComponent();

MainPage = new AppShell();
}
}
}
14 changes: 14 additions & 0 deletions AIInvestingCompanies/AIInvestingCompanies/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="AIInvestingCompanies.AppShell"
xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:AIInvestingCompanies"
Shell.FlyoutBehavior="Disabled"
Title="AIInvestingCompanies">

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

</Shell>
10 changes: 10 additions & 0 deletions AIInvestingCompanies/AIInvestingCompanies/AppShell.xaml.cs
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
namespace AIInvestingCompanies
{
public partial class AppShell : Shell
{
public AppShell()
{
InitializeComponent();
}
}
}
91 changes: 91 additions & 0 deletions AIInvestingCompanies/AIInvestingCompanies/MainPage.xaml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,91 @@
<?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"
xmlns:chart="clr-namespace:Syncfusion.Maui.Charts;assembly=Syncfusion.Maui.Charts"
xmlns:model="clr-namespace:AIInvestingCompanies"
x:Class="AIInvestingCompanies.MainPage">

<ContentPage.BindingContext>
<model:ArtificialIntelligenceData/>
</ContentPage.BindingContext>

<Border Stroke="#293b0b" Padding="{OnPlatform Default=10, Android=7,iOS=7}" StrokeShape="RoundRectangle 10" Margin="25" StrokeThickness="1.5">

<chart:SfCartesianChart>
<chart:SfCartesianChart.Title>
<Grid>

<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>

<Grid.ColumnDefinitions>
<ColumnDefinition Width="50"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>

<Image Grid.Column="0" Grid.RowSpan="2" Source="technology.png" Margin="0,-25,0,20"
HeightRequest="100"
WidthRequest="{OnPlatform Android=40,iOS=40, Default=50}"/>

<StackLayout Grid.Row="0" Grid.Column="1" Margin="5,0,0,0" HorizontalOptions="Start" Orientation="Vertical">
<Label Text="Decoding AI Investments: A Closer Look at Company Spending" FontSize="24" FontAttributes="Bold" TextColor="#666666" FontFamily="AntaRegular"/>
<Label Text="Total global corporate investment in artificial intelligence (in billions of U.S. dollars)" FontSize="{OnPlatform Android=14,iOS=14, Default=17}" TextColor="Gray" Margin="0,2,0,0" FontFamily="AntaRegular"/>

</StackLayout>
<StackLayout Grid.Row="1" Grid.Column="1" Orientation="Horizontal" Margin="15,-15,0,0" >
<Rectangle HeightRequest="15" WidthRequest="40" RadiusX="5" RadiusY="5" Fill="#0DAA97" />
<Label Text="&lt; 50" FontSize="15" Margin="7,13,0,0" />
<Rectangle HeightRequest="15" WidthRequest="40" RadiusX="5" RadiusY="5" Fill="#9455FC" Margin="10,0,0,0" />
<Label Text="&lt; 100" Margin="7,13,0,0" FontSize="15"/>
<Rectangle HeightRequest="15" WidthRequest="40" RadiusX="5" RadiusY="5" Fill="#EA8D03" Margin="10,0,0,0" />
<Label Text="&gt; 100" Margin="7,13,0,0" FontSize="15"/>
</StackLayout>
</Grid>
</chart:SfCartesianChart.Title>

<chart:SfCartesianChart.XAxes>
<model:CategoryAxisExt IsInversed="True" PlotOffsetStart="40" ShowMajorGridLines="False">
<chart:CategoryAxis.MajorTickStyle>
<chart:ChartAxisTickStyle StrokeWidth="0"/>
</chart:CategoryAxis.MajorTickStyle>
</model:CategoryAxisExt>
</chart:SfCartesianChart.XAxes>

<chart:SfCartesianChart.YAxes>
<model:NumericalAxisExt PlotOffsetEnd="60" ShowMajorGridLines="False">
<chart:NumericalAxis.MajorTickStyle>
<chart:ChartAxisTickStyle StrokeWidth="0"/>
</chart:NumericalAxis.MajorTickStyle>
<chart:NumericalAxis.LabelStyle>
<chart:ChartAxisLabelStyle FontSize="1" TextColor="Transparent"/>
</chart:NumericalAxis.LabelStyle>
</model:NumericalAxisExt>
</chart:SfCartesianChart.YAxes>


<chart:ColumnSeries ItemsSource="{Binding Data}" XBindingPath="Year" YBindingPath="Value" CornerRadius="10,10,0,0"
ShowDataLabels="True" PaletteBrushes="{Binding CustomBrushes}">
<chart:ColumnSeries.DataLabelSettings>
<chart:CartesianDataLabelSettings LabelPlacement="Outer" UseSeriesPalette="False">
<chart:CartesianDataLabelSettings.LabelStyle>
<chart:ChartDataLabelStyle LabelFormat="#.#" FontSize="13" TextColor="Black"/>
</chart:CartesianDataLabelSettings.LabelStyle>
</chart:CartesianDataLabelSettings>
</chart:ColumnSeries.DataLabelSettings>
</chart:ColumnSeries>

<chart:SfCartesianChart.PlotAreaBackgroundView>
<AbsoluteLayout>
<Image Source="artificialintelligence.png"
AbsoluteLayout.LayoutBounds="0.2,0.4,-1,-1"
AbsoluteLayout.LayoutFlags="PositionProportional"
HeightRequest="{OnPlatform Android=75,iOS=75, Default=150}"
WidthRequest="{OnPlatform Android=75,iOS=75, Default=150}"/>
</AbsoluteLayout>
</chart:SfCartesianChart.PlotAreaBackgroundView>

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

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

public class CategoryAxisExt : CategoryAxis
{
protected override void DrawAxisLine(ICanvas canvas, float x1, float y1, float x2, float y2)
{
var path = new PathF();
path.MoveTo(x1 + 20, y1);
path.LineTo(x2, y2);

// Calculate the direction vector of the line
float dx = x2 - x1;
float dy = y2 - y1;

// Normalize the direction vector
float length = (float)Math.Sqrt(dx * dx + dy * dy);
float nx = dx / length;
float ny = dy / length;

// Length of the arrowhead
float arrowLength = 15;

// Calculate points for the arrowhead
float arrowPoint1X = x1 + nx * arrowLength + ny * arrowLength / 2;
float arrowPoint1Y = y1 + ny * arrowLength - nx * arrowLength / 2;
float arrowPoint2X = x1 + nx * arrowLength - ny * arrowLength / 2;
float arrowPoint2Y = y1 + ny * arrowLength + nx * arrowLength / 2;

// Draw lines for the arrowhead
path.MoveTo(x1 + 20, y1);
path.LineTo(arrowPoint1X + 25, arrowPoint1Y - 5);
path.MoveTo(x1 + 20, y1);
path.LineTo(arrowPoint2X + 25, arrowPoint2Y + 5);

canvas.StrokeColor = (new SolidColorBrush(Color.FromArgb("#1D5B6F"))).Color;

#if ANDROID || IOS
canvas.StrokeSize = 1;

#elif MACCATALYST || WINDOWS
canvas.StrokeSize = 3;

#endif
canvas.DrawPath(path);
}
}
public class NumericalAxisExt : NumericalAxis
{
protected override void DrawAxisLine(ICanvas canvas, float x1, float y1, float x2, float y2)
{
var path = new PathF();
path.MoveTo(x1, y1 + 20);
path.LineTo(x2, y2);

// Calculate the direction vector of the line
float dx = x2 - x1;
float dy = y2 - y1;

// Normalize the direction vector
float length = (float)Math.Sqrt(dx * dx + dy * dy);
float nx = dx / length;
float ny = dy / length;

// Length of the arrowhead
float arrowLength = 12;

// Calculate points for the arrowhead
float arrowPoint1X = x1 + nx * arrowLength + ny * arrowLength / 2;
float arrowPoint1Y = y1 + ny * arrowLength - nx * arrowLength / 2;
float arrowPoint2X = x1 + nx * arrowLength - ny * arrowLength / 2;
float arrowPoint2Y = y1 + ny * arrowLength + nx * arrowLength / 2;

// Draw lines for the arrowhead
path.MoveTo(x1, y1 + 20 );
path.LineTo(arrowPoint1X + 5, arrowPoint1Y + 25);
path.MoveTo(x1, y1 + 20 );
path.LineTo(arrowPoint2X - 5, arrowPoint2Y + 25);

canvas.StrokeColor = (new SolidColorBrush(Color.FromArgb("#1D5B6F"))).Color;

#if ANDROID || IOS
canvas.StrokeSize = 1;

#elif MACCATALYST || WINDOWS
canvas.StrokeSize = 3;

#endif
canvas.DrawPath(path);
}
}
}
27 changes: 27 additions & 0 deletions AIInvestingCompanies/AIInvestingCompanies/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 AIInvestingCompanies
{
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 5d7a3b9

Please sign in to comment.