Label cleanup, and option to disable zoom

EnableZoom property,
XAxisMaxLabels allows to not draw all labels when over dense data points
Zoom on Y Axis ticks and X Axis labels

Author: brett-estabrook

Sources/Microcharts.Forms/ChartView.cs

@@ -17,10 +17,6 @@ public ChartView()
         {
             this.BackgroundColor = Color.Transparent;
             this.PaintSurface += OnPaintCanvas;
-
-            var pinchGesture = new PinchGestureRecognizer();
-            pinchGesture.PinchUpdated += OnPinchUpdated;
-            GestureRecognizers.Add(pinchGesture);
         }
 
         public event EventHandler<SKPaintSurfaceEventArgs> ChartPainted;
@@ -68,6 +64,15 @@ private static void OnChartChanged(BindableObject d, object oldValue, object val
 
             if (view.chart != null)
             {
+                AxisBasedChart axisChart = view.chart as AxisBasedChart;
+                if( axisChart != null && axisChart.EnableZoom )
+                {
+                    //FIXME: how to handle disable zoom after already enabled
+                    var pinchGesture = new PinchGestureRecognizer();
+                    pinchGesture.PinchUpdated += view.OnPinchUpdated;
+                    view.GestureRecognizers.Add(pinchGesture);
+                }
+
                 view.handler = view.chart.ObserveInvalidate(view, (v) => v.InvalidateSurface());
             }
         }

Sources/Microcharts.Samples.Forms/Microcharts.Samples.Forms/ChartPage.xaml.cs

@@ -55,22 +55,17 @@ protected void GenerateDynamicData()
                         foreach (var curSeries in series)
                         {
                             var entries = curSeries.Entries.ToList();
-                            bool addLabel = (entries.Count % 1000) == 0;
 
                             if (s == curSeries)
                             {
                                 var entry = Data.GenerateTimeSeriesEntry(r, idx, 1);
-                                if (!addLabel) entry.First().Label = null;
-
                                 entries.AddRange(entry);
 
                                 if (entries.Count() > count * 1.5) entries.RemoveAt(0);
                             }
                             else
                             {
                                 var entry = new ChartEntry(null) { ValueLabel = null, Label = label };
-                                if (!addLabel) entry.Label = null;
-
                                 entries.Add(entry);
                                 if (entries.Count() > count * 1.5) entries.RemoveAt(0);
                             }

Sources/Microcharts.Samples/Data.cs

@@ -1340,6 +1340,7 @@ private static IEnumerable<ExampleChartItem> GenerateLineSeriesChartExample()
                     LabelOrientation = Orientation.Vertical,
                     ValueLabelOrientation = Orientation.Vertical,
                     LabelTextSize = 14,
+                    EnableZoom = true,
                     LineMode = LineMode.Straight,
                     PointMode = PointMode.None,
                     LineAreaAlpha = 0,
@@ -1352,6 +1353,7 @@ private static IEnumerable<ExampleChartItem> GenerateLineSeriesChartExample()
                     MaxValue = 150,
                     MinValue = -150,
                     YAxisPosition = Position.Left,
+                    XAxisMaxLabels = 20,
                     LegendOption = SeriesLegendOption.Bottom,
 
                     Series = new List<ChartSerie>()
@@ -1512,7 +1514,7 @@ public static IEnumerable<ChartEntry> GenerateTimeSeriesEntry( Random r, int idx
             do
             {
                 if (withNulls && (value.Value % 10) == 0) value = null;
-                entries.Add(new ChartEntry(value) { ValueLabel = value.ToString(), Label = count % 1000 == 0 ? label.ToString("mm:ss") : null });
+                entries.Add(new ChartEntry(value) { ValueLabel = value.ToString(), Label =label.ToString("mm:ss") });
                 valOffset = ((label - baseTime).TotalSeconds + phase) * valScale;
                 ampOffset = ((label - baseTime).TotalSeconds + phase) * ampScale;
                 value = valueShift + (float)(Math.Sin(valOffset) * (Math.Cos(ampOffset) * amp));

Sources/Microcharts/Charts/AxisBasedChart.cs

@@ -130,6 +130,13 @@ public float SerieLabelTextSize
             set => Set(ref serieLabelTextSize, value);
         }
 
+        /// <summary>
+        /// Determines whether pinch to zoom will work on the chart
+        /// </summary>
+        public bool EnableZoom { get; set; } = false;
+
+        public ChartXForm XForm { get; } = new ChartXForm();
+
         /// <summary>
         /// Show Y Axis Text?
         /// </summary>
@@ -162,7 +169,10 @@ public float SerieLabelTextSize
         public SKPaint YAxisLinesPaint { get; set; }
 
 
-        public ChartXForm XForm { get; } = new ChartXForm();
+        /// <summary>
+        /// How many labels to draw, -1 means all of them
+        /// </summary>
+        public int XAxisMaxLabels { get; set; } = -1;
 
         #endregion
 
@@ -188,7 +198,8 @@ public override void DrawContent(SKCanvas canvas, int width, int height)
                 float minValue = InternalMinValue.HasValue ? InternalMinValue.Value : MinValue;
 
                 //This function might change the min/max value
-                var yAxisSize = MeasureHelper.CalculateYAxis(ShowYAxisText, ShowYAxisLines, entries, YAxisMaxTicks, YAxisTextPaint, YAxisPosition, width, fixedRange, ref maxValue, ref minValue, out float yAxisXShift, out List<float> yAxisIntervalLabels);
+                int yMaxTicks = (int)(YAxisMaxTicks * XForm.Scale);
+                var yAxisSize = MeasureHelper.CalculateYAxis(ShowYAxisText, ShowYAxisLines, entries, yMaxTicks, YAxisTextPaint, YAxisPosition, width, fixedRange, ref maxValue, ref minValue, out float yAxisXShift, out List<float> yAxisIntervalLabels);
                 width = (int)yAxisSize.Width;
 
                 float valRange = maxValue - minValue;
@@ -238,7 +249,7 @@ public override void DrawContent(SKCanvas canvas, int width, int height)
                 */
 
                 canvas.Save();
-                canvas.ClipRect(yAxisRect);
+                if(EnableZoom) canvas.ClipRect(yAxisRect);
                 DrawHelper.DrawYAxis(ShowYAxisText, ShowYAxisLines, YAxisPosition, YAxisTextPaint, YAxisLinesPaint, XForm.Offset, XForm.Scale, Margin, AnimationProgress, maxValue, valRange, canvas, width, yAxisXShift, yAxisIntervalLabels, headerHeight, itemSize, origin);
                 canvas.Restore();
 
@@ -252,9 +263,11 @@ public override void DrawContent(SKCanvas canvas, int width, int height)
                     int entryCount = entries.Count();
 
                     canvas.Save();
-                    canvas.ClipRect(labelRect);
+                    if (EnableZoom) canvas.ClipRect(labelRect);
 
-                    for (int i = 0; i < labels.Length; i++)
+                    int xMaxLabels = (int)(XAxisMaxLabels * XForm.Scale);
+                    int xlabelSkip = XAxisMaxLabels > 0 ? labels.Length / xMaxLabels : 1;
+                    for (int i = 0; i < labels.Length; i+= xlabelSkip)
                     {
                         var itemX = Margin + (itemSize.Width / 2) + (i * (itemSize.Width + Margin)) + yAxisXShift;
                         float labelX = XForm.Offset.X + (itemX * XForm.Scale);
@@ -269,9 +282,13 @@ public override void DrawContent(SKCanvas canvas, int width, int height)
                     canvas.Restore();
 
                     canvas.Save();
-                    canvas.ClipRect(chartRect);
-                    canvas.Translate(XForm.Offset);
-                    canvas.Scale(XForm.Scale);
+                    if (EnableZoom)
+                    {
+                        canvas.ClipRect(chartRect);
+                        canvas.Translate(XForm.Offset);
+                        canvas.Scale(XForm.Scale);
+                    }
+
                     for (int i = 0; i < labels.Length; i++)
                     {
                         if (i >= entryCount) break;
@@ -304,9 +321,12 @@ public override void DrawContent(SKCanvas canvas, int width, int height)
                 DrawLegend(canvas, seriesSizes, legendHeight, height, width);
 
                 canvas.Save();
-                canvas.ClipRect(chartRect);
-                canvas.Translate(XForm.Offset);
-                canvas.Scale(XForm.Scale);
+                if (EnableZoom)
+                {
+                    canvas.ClipRect(chartRect);
+                    canvas.Translate(XForm.Offset);
+                    canvas.Scale(XForm.Scale);
+                }
                 OnDrawContentEnd(canvas, itemSize, origin, valueLabelSizes);
                 canvas.Restore();
             }