Merge pull request #599 from beto-rodriguez/axes-features

Adds missing visual features to the Axis class.
beto-rodriguez · Aug 27, 2022 · 6f7f1b2 · 6f7f1b2
2 parents 8c2ea38 + a0dd7bb
commit 6f7f1b2
Show file tree

Hide file tree

Showing 18 changed files with 713 additions and 316 deletions.
diff --git a/samples/AvaloniaSample/Axes/Style/View.axaml b/samples/AvaloniaSample/Axes/Style/View.axaml
@@ -2,14 +2,18 @@
              xmlns="https://github.com/avaloniaui"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:lvc="using:LiveChartsCore.SkiaSharpView.Avalonia"
-             xmlns:vms="using:ViewModelsSamples.Axes.Style">
+             xmlns:vms="using:ViewModelsSamples.Axes.Style"
+             Background="#333333">
   <UserControl.DataContext>
     <vms:ViewModel/>
   </UserControl.DataContext>
   <lvc:CartesianChart
+    Margin="20"
     Series="{Binding Series}"
     XAxes="{Binding XAxes}"
     YAxes="{Binding YAxes}"
-    DrawMarginFrame="{Binding Frame}">
+    DrawMarginFrame="{Binding Frame}"
+    ZoomMode="Both"
+    TooltipPosition="Hidden">
   </lvc:CartesianChart>
 </UserControl>
diff --git a/samples/BlazorSample/Pages/Axes/Style.razor b/samples/BlazorSample/Pages/Axes/Style.razor
@@ -2,12 +2,16 @@
 @using LiveChartsCore.SkiaSharpView.Blazor
 @using ViewModelsSamples.Axes.Style
 
-<CartesianChart
-	Series="ViewModel.Series"
-	XAxes="ViewModel.XAxes"
-	YAxes="ViewModel.YAxes"
-	DrawMarginFrame="ViewModel.Frame">
-</CartesianChart>
+<div style="background-color: #333333; padding: 20px">
+    <CartesianChart
+        Series="ViewModel.Series"
+        XAxes="ViewModel.XAxes"
+        YAxes="ViewModel.YAxes"
+        DrawMarginFrame="ViewModel.Frame"
+        ZoomMode="LiveChartsCore.Measure.ZoomAndPanMode.Both"
+        TooltipPosition="LiveChartsCore.Measure.TooltipPosition.Hidden">
+    </CartesianChart>
+</div>
 
 @code {
 	public ViewModel ViewModel { get; set; } = new();

diff --git a/samples/EtoFormsSample/Axes/Style/View.cs b/samples/EtoFormsSample/Axes/Style/View.cs
@@ -10,6 +10,7 @@ public class View : Panel
 
     public View()
     {
+        BackgroundColor = new Eto.Drawing.Color(60, 60, 60);
         var viewModel = new ViewModel();
 
         cartesianChart = new CartesianChart
@@ -18,6 +19,8 @@ public View()
             XAxes = viewModel.XAxes,
             YAxes = viewModel.YAxes,
             DrawMarginFrame = viewModel.Frame,
+            ZoomMode = LiveChartsCore.Measure.ZoomAndPanMode.Both,
+            TooltipPosition = LiveChartsCore.Measure.TooltipPosition.Hidden
         };
 
         Content = cartesianChart;

diff --git a/samples/MauiSample/Axes/Style/View.xaml b/samples/MauiSample/Axes/Style/View.xaml
@@ -8,9 +8,12 @@
         <vms:ViewModel/>
     </ContentPage.BindingContext>
     <lvc:CartesianChart
+        Margin="20"
         Series="{Binding Series}"
         XAxes="{Binding XAxes}"
         YAxes="{Binding YAxes}"
-        DrawMarginFrame="{Binding Frame}">
+        DrawMarginFrame="{Binding Frame}"
+        ZoomMode="Both"
+        TooltipPosition="Hidden">
     </lvc:CartesianChart>
 </ContentPage>
diff --git a/samples/UWPSample/Axes/Style/View.xaml b/samples/UWPSample/Axes/Style/View.xaml
@@ -10,10 +10,15 @@
     <UserControl.DataContext>
         <vms:ViewModel/>
     </UserControl.DataContext>
-    <lvc:CartesianChart
-        Series="{Binding Series}"
-        XAxes="{Binding XAxes}"
-        YAxes="{Binding YAxes}"
-        DrawMarginFrame="{Binding Frame}">
-    </lvc:CartesianChart>
+    <Grid Background="#333333">
+        <lvc:CartesianChart
+            Margin="20"
+            Series="{Binding Series}"
+            XAxes="{Binding XAxes}"
+            YAxes="{Binding YAxes}"
+            DrawMarginFrame="{Binding Frame}"
+            ZoomMode="Both"
+            TooltipPosition="Hidden">
+        </lvc:CartesianChart>
+    </Grid>
 </UserControl>
diff --git a/samples/UnoSample/UnoSample.Shared/LiveChartsSamples/Axes/Style/View.xaml b/samples/UnoSample/UnoSample.Shared/LiveChartsSamples/Axes/Style/View.xaml
@@ -10,10 +10,15 @@
     <UserControl.DataContext>
         <vms:ViewModel/>
     </UserControl.DataContext>
-    <lvc:CartesianChart
-        Series="{Binding Series}"
-        XAxes="{Binding XAxes}"
-        YAxes="{Binding YAxes}"
-        DrawMarginFrame="{Binding Frame}">
-    </lvc:CartesianChart>
+    <Grid Background="#333333">
+        <lvc:CartesianChart
+            Margin="20"
+            Series="{Binding Series}"
+            XAxes="{Binding XAxes}"
+            YAxes="{Binding YAxes}"
+            DrawMarginFrame="{Binding Frame}"
+            ZoomMode="Both"
+            TooltipPosition="Hidden">
+        </lvc:CartesianChart>
+    </Grid>
 </UserControl>
diff --git a/...noWinUISample/UnoWinUISample/UnoWinUISample.Shared/LiveChartsSamples/Axes/Style/View.xaml b/...noWinUISample/UnoWinUISample/UnoWinUISample.Shared/LiveChartsSamples/Axes/Style/View.xaml
@@ -10,10 +10,15 @@
     <UserControl.DataContext>
         <vms:ViewModel/>
     </UserControl.DataContext>
-    <lvc:CartesianChart
-        Series="{Binding Series}"
-        XAxes="{Binding XAxes}"
-        YAxes="{Binding YAxes}"
-        DrawMarginFrame="{Binding Frame}">
-    </lvc:CartesianChart>
+    <Grid Background="#333333">
+        <lvc:CartesianChart
+            Margin="20"
+            Series="{Binding Series}"
+            XAxes="{Binding XAxes}"
+            YAxes="{Binding YAxes}"
+            DrawMarginFrame="{Binding Frame}"
+            ZoomMode="Both"
+            TooltipPosition="Hidden">
+        </lvc:CartesianChart>
+    </Grid>
 </UserControl>
diff --git a/samples/ViewModelsSamples/Axes/Style/ViewModel.cs b/samples/ViewModelsSamples/Axes/Style/ViewModel.cs
@@ -1,5 +1,7 @@
-using CommunityToolkit.Mvvm.ComponentModel;
+using System.Collections.Generic;
+using CommunityToolkit.Mvvm.ComponentModel;
 using LiveChartsCore;
+using LiveChartsCore.Defaults;
 using LiveChartsCore.SkiaSharpView;
 using LiveChartsCore.SkiaSharpView.Painting;
 using LiveChartsCore.SkiaSharpView.Painting.Effects;
@@ -10,11 +12,17 @@ namespace ViewModelsSamples.Axes.Style;
 [ObservableObject]
 public partial class ViewModel
 {
+    private static readonly SKColor s_gray = new(195, 195, 195);
+    private static readonly SKColor s_gray1 = new(160, 160, 160);
+    private static readonly SKColor s_gray2 = new(90, 90, 90);
+    private static readonly SKColor s_dark3 = new(60, 60, 60);
+
     public ISeries[] Series { get; set; } =
     {
-        new LineSeries<int>
+        new LineSeries<ObservablePoint>
         {
-            Values = new int[] { 5, 3, 2, 8, 7, 4, 5, 4, 6, 7, 5 },
+            Values = Fetch(),
+            Stroke = new SolidColorPaint(new SKColor(33, 150, 243), 4),
             Fill = null,
             GeometrySize = 0
         }
@@ -24,15 +32,36 @@ public partial class ViewModel
     {
         new Axis
         {
-            MinLimit = 0,
-            MaxLimit = 10,
-            ForceStepToMin = true,
-            MinStep = 0.5,
-            TextSize = 14,
+            Name = "X axis",
+            NamePaint = new SolidColorPaint(s_gray1),
+            TextSize = 18,
+            Padding = new LiveChartsCore.Drawing.Padding(5, 15, 5, 5),
+            LabelsPaint = new SolidColorPaint(s_gray),
             SeparatorsPaint = new SolidColorPaint
             {
-                Color = SKColors.Gray,
+                Color = s_gray,
+                StrokeThickness = 1,
+                PathEffect = new DashEffect(new float[] { 3, 3 })
+            },
+            SubseparatorsPaint = new SolidColorPaint
+            {
+                Color = s_gray2,
+                StrokeThickness = 0.5f
+            },
+            ZeroPaint = new SolidColorPaint
+            {
+                Color = s_gray1,
                 StrokeThickness = 2
+            },
+            TicksPaint = new SolidColorPaint
+            {
+                Color = s_gray,
+                StrokeThickness = 1.5f
+            },
+            SubticksPaint = new SolidColorPaint
+            {
+                Color = s_gray,
+                StrokeThickness = 1
             }
         }
     };
@@ -41,31 +70,62 @@ public partial class ViewModel
     {
         new Axis
         {
-            MinLimit = 0,
-            MaxLimit = 10,
-            ForceStepToMin = true,
-            MinStep = 1,
-            TextSize = 14,
+            Name = "Y axis",
+            NamePaint = new SolidColorPaint(s_gray1),
+            TextSize = 18,
+            Padding = new LiveChartsCore.Drawing.Padding(5, 0, 15, 0),
+            LabelsPaint = new SolidColorPaint(s_gray),
             SeparatorsPaint = new SolidColorPaint
             {
-                Color = SKColors.Gray,
-                StrokeThickness = 2,
+                Color = s_gray,
+                StrokeThickness = 1,
                 PathEffect = new DashEffect(new float[] { 3, 3 })
+            },
+            SubseparatorsPaint = new SolidColorPaint
+            {
+                Color = s_gray2,
+                StrokeThickness = 0.5f
+            },
+            ZeroPaint = new SolidColorPaint
+            {
+                Color = s_gray1,
+                StrokeThickness = 2
+            },
+            TicksPaint = new SolidColorPaint
+            {
+                Color = s_gray,
+                StrokeThickness = 1.5f
+            },
+            SubticksPaint = new SolidColorPaint
+            {
+                Color = s_gray,
+                StrokeThickness = 1
             }
         }
     };
 
     public DrawMarginFrame Frame { get; set; } =
     new()
     {
-        Fill = new SolidColorPaint
-        {
-            Color = new SKColor(0, 0, 0, 30)
-        },
+        Fill = new SolidColorPaint(s_dark3),
         Stroke = new SolidColorPaint
         {
-            Color = new SKColor(80, 80, 80),
-            StrokeThickness = 2
+            Color = s_gray,
+            StrokeThickness = 1
         }
     };
+
+    private static List<ObservablePoint> Fetch()
+    {
+        var list = new List<ObservablePoint>();
+        var fx = EasingFunctions.BounceInOut;
+
+        for (var x = 0f; x < 1f; x += 0.001f)
+        {
+            var y = fx(x);
+            list.Add(new ObservablePoint(x - 0.5, y - 0.5));
+        }
+
+        return list;
+    }
 }
diff --git a/samples/WPFSample/Axes/Style/View.xaml b/samples/WPFSample/Axes/Style/View.xaml
@@ -2,14 +2,18 @@
              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
              xmlns:lvc="clr-namespace:LiveChartsCore.SkiaSharpView.WPF;assembly=LiveChartsCore.SkiaSharpView.WPF"
-             xmlns:vms="clr-namespace:ViewModelsSamples.Axes.Style;assembly=ViewModelsSamples">
+             xmlns:vms="clr-namespace:ViewModelsSamples.Axes.Style;assembly=ViewModelsSamples"
+             Background="#333333">
     <UserControl.DataContext>
         <vms:ViewModel/>
     </UserControl.DataContext>
     <lvc:CartesianChart
+        Margin="20"
         Series="{Binding Series}"
         XAxes="{Binding XAxes}"
         YAxes="{Binding YAxes}"
-        DrawMarginFrame="{Binding Frame}">
+        DrawMarginFrame="{Binding Frame}"
+        ZoomMode="Both"
+        TooltipPosition="Hidden">
     </lvc:CartesianChart>
 </UserControl>
diff --git a/samples/WinFormsSample/Axes/Style/View.cs b/samples/WinFormsSample/Axes/Style/View.cs
@@ -1,4 +1,5 @@
-using System.Windows.Forms;
+using System.Drawing;
+using System.Windows.Forms;
 using LiveChartsCore.SkiaSharpView.WinForms;
 using ViewModelsSamples.Axes.Style;
 
@@ -12,6 +13,7 @@ public View()
     {
         InitializeComponent();
         Size = new System.Drawing.Size(100, 100);
+        BackColor = Color.FromArgb(255, 50, 50, 50);
 
         var viewModel = new ViewModel();
 
@@ -21,6 +23,8 @@ public View()
             XAxes = viewModel.XAxes,
             YAxes = viewModel.YAxes,
             DrawMarginFrame = viewModel.Frame,
+            ZoomMode = LiveChartsCore.Measure.ZoomAndPanMode.Both,
+            TooltipPosition = LiveChartsCore.Measure.TooltipPosition.Hidden,
 
             // out of livecharts properties...
             Location = new System.Drawing.Point(0, 0),

diff --git a/samples/WinUISample/WinUISample/Axes/Style/View.xaml b/samples/WinUISample/WinUISample/Axes/Style/View.xaml
@@ -10,10 +10,14 @@
     <UserControl.DataContext>
         <vms:ViewModel/>
     </UserControl.DataContext>
-    <lvc:CartesianChart
-        Series="{Binding Series}"
-        XAxes="{Binding XAxes}"
-        YAxes="{Binding YAxes}"
-        DrawMarginFrame="{Binding Frame}">
-    </lvc:CartesianChart>
+    <Grid Background="#333333">
+        <lvc:CartesianChart
+            Series="{Binding Series}"
+            XAxes="{Binding XAxes}"
+            YAxes="{Binding YAxes}"
+            DrawMarginFrame="{Binding Frame}"
+            TooltipPosition="Hidden"
+            ZoomMode="Both">
+        </lvc:CartesianChart>
+    </Grid>
 </UserControl>
diff --git a/samples/XamarinSample/XamarinSample/XamarinSample.Android/Resources/Resource.designer.cs b/samples/XamarinSample/XamarinSample/XamarinSample.Android/Resources/Resource.designer.cs
diff --git a/samples/XamarinSample/XamarinSample/XamarinSample/Axes/Style/View.xaml b/samples/XamarinSample/XamarinSample/XamarinSample/Axes/Style/View.xaml
@@ -3,14 +3,18 @@
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
              x:Class="XamarinSample.Axes.Style.View"
              xmlns:lvc="clr-namespace:LiveChartsCore.SkiaSharpView.Xamarin.Forms;assembly=LiveChartsCore.SkiaSharpView.XamarinForms"
-             xmlns:vms="clr-namespace:ViewModelsSamples.Axes.Style;assembly=ViewModelsSamples">
+             xmlns:vms="clr-namespace:ViewModelsSamples.Axes.Style;assembly=ViewModelsSamples"
+             Background="#333333">
     <ContentPage.BindingContext>
         <vms:ViewModel/>
     </ContentPage.BindingContext>
     <lvc:CartesianChart
+        Margin="20"
         Series="{Binding Series}"
         XAxes="{Binding XAxes}"
         YAxes="{Binding YAxes}"
-        DrawMarginFrame="{Binding Frame}">
+        DrawMarginFrame="{Binding Frame}"
+        ZoomMode="Both"
+        TooltipPosition="Hidden">
     </lvc:CartesianChart>
 </ContentPage>