Fix and improve axis-tick configurations

src/ChartJs.Blazor/ChartJS/Common/Axes/Ticks/CartesianTicks.cs

@@ -1,50 +1,61 @@
 namespace ChartJs.Blazor.ChartJS.Common.Axes.Ticks
 {
     /// <summary>
+    /// The base class for all tick mark configurations of cartesian axes (see <see cref="CartesianAxis"/>). Ticks-subconfig of <see cref="CartesianAxis"/>.
     /// As per documentation here https://www.chartjs.org/docs/latest/axes/cartesian/#tick-configuration
     /// </summary>
-    public abstract class CartesianTicks
+    public abstract class CartesianTicks : Ticks
     {
+        /// <summary>
+        /// Gets or sets the user defined minimum number for the scale, overrides minimum value from data.
+        /// </summary>
+        public double? Min { get; set; }
+
+        /// <summary>
+        /// Gets or sets the user defined maximum number for the scale, overrides maximum value from data.
+        /// </summary>
+        public double? Max { get; set; }
+
+        /// <summary>
+        /// The number of ticks to examine when deciding how many labels will fit.
+        /// Setting a smaller value will be faster, but may be less accurate when there is large variability in label length.
+        /// </summary>
+        public int? SampleSize { get; set; }
+
         /// <summary>
         /// If true, automatically calculates how many labels can be shown and hides labels accordingly. 
-        /// Labels will be rotated up to maxRotation before skipping any. Turn autoSkip off to show all labels no matter what.
+        /// Labels will be rotated up to maxRotation before skipping any. Turn <see cref="AutoSkip" /> off to show all labels no matter what.
         /// </summary>
         public bool AutoSkip { get; set; } = true;
 
         /// <summary>
-        /// Padding between the ticks on the horizontal axis when <see cref="AutoSkip"></see> is enabled.
+        /// Gets or sets the padding between the ticks on the horizontal axis when <see cref="AutoSkip" /> is enabled.
         /// </summary>
         public int AutoSkipPadding { get; set; }
 
         /// <summary>
-        /// Distance in pixels to offset the label from the centre point of the tick (in the x direction for the x axis, and the y direction for the y axis).
+        /// Gets or sets the distance in pixels to offset the label from the centre point of the tick (in the x direction for the x axis, and the y direction for the y axis).
         /// <para>Note: this can cause labels at the edges to be cropped by the edge of the canvas.</para>
         /// </summary>
         public int LabelOffset { get; set; }
 
         /// <summary>
-        /// Maximum rotation for tick labels when rotating to condense labels. 
+        /// Gets or sets the maximum rotation for tick labels when rotating to condense labels.
         /// <para>Note: Rotation doesn't occur until necessary.</para>
         /// <para>Note: Only applicable to horizontal scales.</para>
         /// </summary>
         public int? MaxRotation { get; set; }
 
         /// <summary>
-        /// Minimum rotation for tick labels. 
+        /// Gets or sets the minimum rotation for tick labels.
         /// <para>Note: Only applicable to horizontal scales.</para>
         /// </summary>
         public int? MinRotation { get; set; }
 
         /// <summary>
-        /// Flips tick labels around axis, displaying the labels inside the chart instead of outside.
+        /// If true, flips tick labels around axis, displaying the labels inside the chart instead of outside.
         /// <para>Note: Only applicable to vertical scales.</para>
         /// </summary>
         public bool? Mirror { get; set; }
-
-        /// <summary>
-        /// Padding between the tick label and the axis. When set on a vertical axis, this applies in the horizontal (X) direction. 
-        /// When set on a horizontal axis, this applies in the vertical (Y) direction.
-        /// </summary>
-        public int Padding { get; set; }
     }
 }

src/ChartJs.Blazor/ChartJS/Common/Axes/Ticks/CategoryTicks.cs

@@ -2,21 +2,24 @@
 
 namespace ChartJs.Blazor.ChartJS.Common.Axes.Ticks
 {
+    /// <summary>
+    /// The ticks-subconfig of <see cref="CategoryAxis"/>.
+    /// </summary>
     public class CategoryTicks : CartesianTicks
     {
         /// <summary>
-        /// An array of labels to display.
+        /// Gets or sets an array of labels to display.
         /// </summary>
         public List<string> Labels { get; set; }
 
         /// <summary>
-        /// The minimum item to display. The item has to be present in <see cref="Labels"/>.
+        /// Gets or sets the minimum item to display. The item has to be present in <see cref="Labels"/>.
         /// <para>Read more https://www.chartjs.org/docs/latest/axes/cartesian/category.html#min-max-configuration </para>
         /// </summary>
         public string Min { get; set; }
 
         /// <summary>
-        /// The maximum item to display. The item has to be present in <see cref="Labels"/>.
+        /// Gets or sets the maximum item to display. The item has to be present in <see cref="Labels"/>.
         /// <para>Read more https://www.chartjs.org/docs/latest/axes/cartesian/category.html#min-max-configuration </para>
         /// </summary>
         public string Max { get; set; }

src/ChartJs.Blazor/ChartJS/Common/Axes/Ticks/LinearCartesianTicks.cs

@@ -2,6 +2,7 @@
 namespace ChartJs.Blazor.ChartJS.Common.Axes.Ticks
 {
     /// <summary>
+    /// The ticks-subconfig of <see cref="LinearCartesianAxis"/>.
     /// https://www.chartjs.org/docs/latest/axes/cartesian/linear.html#tick-configuration-options
     /// </summary>
     public class LinearCartesianTicks : CartesianTicks
@@ -12,38 +13,30 @@ public class LinearCartesianTicks : CartesianTicks
         public bool? BeginAtZero { get; set; }
 
         /// <summary>
-        /// User defined minimum number for the scale, overrides minimum value from data.
-        /// </summary>
-        public int? Min { get; set; }
-
-        /// <summary>
-        /// User defined maximum number for the scale, overrides maximum value from data.
-        /// </summary>
-        public int? Max { get; set; }
-
-        /// <summary>
-        /// Maximum number of ticks and gridlines to show.
+        /// Gets or sets the maximum number of ticks and gridlines to show.
         /// </summary>
         public int MaxTicksLimit { get; set; } = 11;
 
         /// <summary>
-        /// if defined and <see cref="StepSize"></see> is not specified, the step size will be rounded to this many decimal places.
+        /// If defined and <see cref="StepSize"/> is not specified, the step size will be rounded to this many decimal places.
         /// </summary>
         public int? Precision { get; set; }
 
         /// <summary>
-        /// User defined fixed step size for the scale.
+        /// Gets or sets the user defined fixed step size for the scale.
         /// <para>See https://www.chartjs.org/docs/latest/axes/cartesian/linear.html#step-size for details</para>
         /// </summary>
         public double? StepSize { get; set; }
 
         /// <summary>
-        /// Adjustment used when calculating the maximum data value. This value is used as the highest value if it's higher than the maximum data-value.
+        /// Gets or sets the adjustment used when calculating the maximum data value.
+        /// This value is used as the highest value if it's higher than the maximum data-value.
         /// </summary>
         public int? SuggestedMax { get; set; }
 
         /// <summary>
-        /// Adjustment used when calculating the minimum data value. This value is used as the lowest value if it's lower than the minimum data-value.
+        /// Gets or sets the adjustment used when calculating the minimum data value.
+        /// This value is used as the lowest value if it's lower than the minimum data-value.
         /// </summary>
         public int? SuggestedMin { get; set; }
     }

src/ChartJs.Blazor/ChartJS/Common/Axes/Ticks/LinearRadialTicks .cs

@@ -48,7 +48,7 @@ public class LinearRadialTicks : Ticks
         public int MaxTicksLimit { get; set; } = 11;
 
         /// <summary>
-        /// If defined and StepSize is not specified, the step size will be rounded to this many decimal places.
+        /// If defined and <see cref="StepSize"/> is not specified, the step size will be rounded to this many decimal places.
         /// </summary>
         public int? Precision { get; set; }
 

src/ChartJs.Blazor/ChartJS/Common/Axes/Ticks/LogarithmicTicks.cs

@@ -1,16 +1,11 @@
 
 namespace ChartJs.Blazor.ChartJS.Common.Axes.Ticks
 {
+    /// <summary>
+    /// The ticks-subconfig of <see cref="LogarithmicAxis"/>. It has the same members as <see cref="CartesianTicks"/>.
+    /// https://www.chartjs.org/docs/latest/axes/cartesian/logarithmic.html#tick-configuration-options
+    /// </summary>
     public class LogarithmicTicks : CartesianTicks
     {
-        /// <summary>
-        /// User defined minimum number for the scale, overrides minimum value from data.
-        /// </summary>
-        public int Min { get; set; }
-
-        /// <summary>
-        /// User defined maximum number for the scale, overrides maximum value from data.
-        /// </summary>
-        public int Max { get; set; }
     }
 }

src/ChartJs.Blazor/ChartJS/Common/Axes/Ticks/SubTicks.cs

@@ -4,12 +4,12 @@
 namespace ChartJs.Blazor.ChartJS.Common.Axes.Ticks
 {
     /// <summary>
-    /// The base class for minor and major ticks (see <see cref="MinorTicks"/> and see <see cref="MajorTicks"/>).
+    /// The ultimate base class for tick mark configurations.
     /// </summary>
     public abstract class SubTicks
     {
         /// <summary>
-        /// Gets or sets the font color for a tick's labels.
+        /// Gets or sets the font color for a tick's label.
         /// <para>See <see cref="ColorUtil"/> for working with colors.</para>
         /// </summary>
         public string FontColor { get; set; }
@@ -22,7 +22,7 @@ public abstract class SubTicks
         /// <summary>
         /// Gets or sets the font size for a tick's label.
         /// </summary>
-        public int FontSize { get; set; } = 12;
+        public int? FontSize { get; set; }
 
         /// <summary>
         /// Gets or sets the font style for a tick's label.

src/ChartJs.Blazor/ChartJS/Common/Axes/Ticks/Ticks.cs

@@ -4,61 +4,40 @@
 namespace ChartJs.Blazor.ChartJS.Common.Axes.Ticks
 {
     /// <summary>
-    /// The ticks-subconfig of the axis-configuration (see <see cref="Axis"/>).
+    /// The base class for all tick mark configurations. Ticks-subconfig of the common <see cref="Axis"/>.
     /// <para>As per documentation here https://www.chartjs.org/docs/latest/axes/styling.html#tick-configuration </para>
     /// </summary>
-    public abstract class Ticks
+    public abstract class Ticks : SubTicks
     {
         /// <summary>
-        /// Gets or sets the value indicating whether this shows <see cref="Ticks"/> marks.
+        /// Gets or sets the value indicating whether this axis displays tick marks.
         /// </summary>
         public bool Display { get; set; } = true;
 
         /// <summary>
-        /// Gets or sets the font color for <see cref="Ticks"/> labels.
-        /// <para>See <see cref="ColorUtil"/> for working with colors.</para>
-        /// </summary>
-        public string FontColor { get; set; }
-
-        /// <summary>
-        /// Gets or sets the font family for the <see cref="Ticks"/> labels.
-        /// </summary>
-        public string FontFamily { get; set; }
-
-        /// <summary>
-        /// Gets or sets the font size for the <see cref="Ticks"/> labels.
-        /// </summary>
-        public int FontSize { get; set; } = 12;
-
-        /// <summary>
-        /// Gets or sets the font style for the <see cref="Ticks"/> labels.
-        /// </summary>
-        public FontStyle FontStyle { get; set; }
-
-        /// <summary>
-        /// Gets or sets the height of an individual line of text.
-        /// <para>As per documentation here https://developer.mozilla.org/en-US/docs/Web/CSS/line-height </para>
-        /// </summary>
-        public double LineHeight { get; set; } = 1.2;
-
-        /// <summary>
-        /// Gets or sets the value indicating whether the order of <see cref="Ticks"/> labels is reversed.
+        /// Gets or sets the value indicating whether the order of the tick labels is reversed.
         /// </summary>
         public bool Reverse { get; set; } = false;
 
         /// <summary>
-        /// Gets or sets the minor ticks configuration. Omitted options are inherited from options above (see <see cref="Ticks"/>).
+        /// Gets or sets the minor ticks configuration. Omitted options are inherited.
         /// </summary>
         public MinorTicks Minor { get; set; }
 
         /// <summary>
-        /// Gets or sets the major ticks configuration. Omitted options are inherited from options above (see <see cref="Ticks"/>).
+        /// Gets or sets the major ticks configuration. Omitted options are inherited.
         /// </summary>
         public MajorTicks Major { get; set; }
 
         /// <summary>
-        /// Gets or sets the offset of the tick labels from the axis
+        /// Gets or sets the offset of the tick labels from the axis. When set on a vertical axis, this applies in the horizontal (X) direction.
+        /// When set on a horizontal axis, this applies in the vertical (Y) direction.
         /// </summary>
         public int Padding { get; set; } = 0;
+
+        /// <summary>
+        /// Gets or sets the Z-index of the tick layer. Useful when ticks are drawn on chart area. Values &lt;= 0 are drawn under datasets, &gt; 0 on top.
+        /// </summary>
+        public int Z { get; set; }
     }
 }

src/ChartJs.Blazor/ChartJS/Common/Axes/Ticks/TimeTicks.cs

@@ -2,10 +2,13 @@
 
 namespace ChartJs.Blazor.ChartJS.Common.Axes.Ticks
 {
+    /// <summary>
+    /// The ticks-subconfig of a <see cref="TimeAxis"/>.
+    /// </summary>
     public class TimeTicks : CartesianTicks
     {
         /// <summary>
-        /// How ticks are generated. 
+        /// Gets or sets how ticks are generated.
         /// </summary>
         public TickSource Source { get; set; }
     }

src/ChartJs.Blazor/ChartJS/Common/Enums/TickSource.cs

@@ -3,21 +3,20 @@
     /// <summary>
     /// As per documentation here https://www.chartjs.org/docs/latest/axes/cartesian/time.html#ticks-source
     /// </summary>
-    /// 
     public sealed class TickSource : StringEnum
     {
         /// <summary>
-        /// Generates "optimal" ticks based on scale size and time options
+        /// Generates "optimal" ticks based on scale size and time options.
         /// </summary>
         public static TickSource Auto => new TickSource("auto");
 
         /// <summary>
-        /// Generates ticks from data (including labels from data {t|x|y} objects)
+        /// Generates ticks from data (including labels from data {t|x|y} objects).
         /// </summary>
         public static TickSource Data => new TickSource("data");
 
         /// <summary>
-        /// Generates ticks from user given <see cref="LineChart.LineData.Labels"/> values ONLY
+        /// Generates ticks from user given <see cref="LineChart.LineData.Labels"/> values ONLY.
         /// </summary>
         public static TickSource Labels => new TickSource("labels");