v27.2.4 is released

Author: pipeline

controls/barcodegenerator/CHANGELOG.md

@@ -2,7 +2,7 @@
 
 ## [Unreleased]
 
-## 27.2.3 (2024-11-21)
+## 27.2.4 (2024-11-26)
 
 ### Barcode
 

controls/buttons/CHANGELOG.md

@@ -2,13 +2,20 @@
 
 ## [Unreleased]
 
-## 27.2.2 (2024-11-15)
+## 27.2.4 (2024-11-26)
 
 ### Checkbox
 
 #### Bug Fixes
 
 - `#F857466`- The issue with "Need to set the label tag for attribute if user changes the checkbox input id in checkbox component" has been resolved.
+
+## 27.2.2 (2024-11-15)
+
+### Checkbox
+
+#### Bug Fixes
+
 - `#F95768`- The issue with "Parent element click event `prevented` while clicking on switch component in angular." has been resolved.
 
 ## 27.1.58 (2024-11-05)

controls/calendars/CHANGELOG.md

@@ -2,7 +2,7 @@
 
 ## [Unreleased]
 
-## 27.2.3 (2024-11-21)
+## 27.2.4 (2024-11-26)
 
 ### DatePicker
 

controls/charts/CHANGELOG.md

@@ -2,6 +2,19 @@
 
 ## [Unreleased]
 
+## 27.2.4 (2024-11-26)
+
+### Chart
+
+#### Bug Fixes
+
+- `#I654525` - Now, the error bar is displayed properly for the larger value.
+- `#I653358` - Now, the text render event’s text argument contains the datetime for the y-axis.
+- `#I654788` - Now, the chart zooms properly while scrolling after it is destroyed and re-rendered.
+- `#I653576` - The data label position is now set correctly for the labelIntersectAction as Hide.
+- `#I653442` - The selection rectangle now renders properly in canvas mode.
+- `#I654149` - Now the spline series animation is proper when adding null values.
+
 ## 27.2.3 (2024-11-21)
 
 ### Chart

controls/charts/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@syncfusion/ej2-charts",
-	"version": "27.2.2",
+	"version": "27.2.3",
 	"description": "Feature-rich chart control with built-in support for over 25 chart types, technical indictors, trendline, zooming, tooltip, selection, crosshair and trackball.",
 	"author": "Syncfusion Inc.",
 	"license": "SEE LICENSE IN license",

controls/charts/spec/chart/base/chart.spec.ts

@@ -1557,5 +1557,22 @@ describe('Chart Control', () => {
             chart.loaded = loaded;
             chart.appendTo('#element');
         });
+        it('Checking the mousewheel event', (done: Function) => {
+            loaded = (args: Object): void => {
+                let wheelArgs: unknown = {
+                    preventDefault: () => {
+                    },
+                    wheelDelta: 120,
+                    detail: 3,
+                    clientX: 210,
+                    clientY: 100
+                };
+                chart.zoomSettings.enableMouseWheelZooming = true;
+                chart.chartOnMouseWheel(<WheelEvent>wheelArgs);
+                done();
+            };
+            chart.loaded = loaded;
+            chart.appendTo('#element');
+        });
     });
 });

controls/charts/src/chart/chart.ts

@@ -3008,7 +3008,7 @@ export class Chart extends Component<HTMLElement> implements INotifyPropertyChan
         const stopEvent: string = Browser.touchEndEvent;
         const cancelEvent: string = Browser.isPointer ? 'pointerleave' : 'mouseleave';
         /** UnBind the Event handler */
-
+        EventHandler.remove(this.element, 'mousewheel', this.chartOnMouseWheel);
         EventHandler.remove(this.element, startEvent, this.chartOnMouseDown);
         EventHandler.remove(this.element, moveEvent, this.mouseMove);
         EventHandler.remove(this.element, stopEvent, this.mouseEnd);
@@ -3048,6 +3048,7 @@ export class Chart extends Component<HTMLElement> implements INotifyPropertyChan
         const cancelEvent: string = Browser.isPointer ? 'pointerleave' : 'mouseleave';
 
         /** Bind the Event handler */
+        EventHandler.add(this.element, 'mousewheel', this.chartOnMouseWheel, this);
         EventHandler.add(this.element, Browser.touchStartEvent, this.chartOnMouseDown, this);
         EventHandler.add(this.element, Browser.touchMoveEvent, this.mouseMove, this);
         EventHandler.add(this.element, Browser.touchEndEvent, this.mouseEnd, this);
@@ -3822,6 +3823,25 @@ export class Chart extends Component<HTMLElement> implements INotifyPropertyChan
         }
     }
 
+    /**
+     * Handles the mouse wheel on the chart.
+     *
+     * @param {WheelEvent} e - The wheel event.
+     * @returns {boolean} - False.
+     * @private
+     */
+    public chartOnMouseWheel(e: WheelEvent): boolean {
+        const offset: ClientRect = this.element.getBoundingClientRect();
+        const svgRect: ClientRect = getElement(this.svgId).getBoundingClientRect();
+        const mouseX: number = (e.clientX - offset.left) - Math.max(svgRect.left - offset.left, 0);
+        const mouseY: number = (e.clientY - offset.top) - Math.max(svgRect.top - offset.top, 0);
+
+        if (this.zoomSettings.enableMouseWheelZooming &&
+            withInBounds(mouseX, mouseY, this.chartAxisLayoutPanel.seriesClipRect)) {
+            this.notify('mousewheel', e);
+        }
+        return false;
+    }
     /**
      * Handles the mouse down on the chart.
      *

controls/charts/src/chart/series/chart-series.ts

@@ -1185,6 +1185,33 @@ export class SeriesBase extends ChildProperty<SeriesBase> {
             }
         }
         this.updateSplineValue();
+        this.updateYAxisForErrorBars();
+    }
+    /**
+     * Calculates the errorbar and adds a range to axis if errorbar exeeds to the actual range.
+     *
+     * @returns {void}
+     * @private
+     */
+    private updateYAxisForErrorBars(): void {
+        if (this instanceof Series) {
+            if (this.chart.errorBarModule) {
+                let maxVerticalError: number;
+                if (this.errorBar.verticalError) {
+                    for (let i: number = 0; i < this.points.length; i++) {
+                        const verticalErrors: number[] = [];
+                        for (let i: number = 0; i < this.points.length; i++) {
+                            const point: Points = this.points[i as number];
+                            if (point.verticalError) {
+                                verticalErrors.push(point.verticalError);
+                            }
+                        }
+                        maxVerticalError = Math.max(...verticalErrors);
+                    }
+                }
+                this.yMax += isNaN(maxVerticalError) ? maxVerticalError / 2 : 0;
+            }
+        }
     }
 
     /**
@@ -2765,7 +2792,8 @@ export class Series extends SeriesBase {
         if (this.chart.enableAnimation && (!(this.isRectSeries || this.type === 'Bubble' || this.type === 'Scatter')) && (this.type.indexOf('step') === -1)) {
             if (this.marker && this.marker.visible && this.visible) {
                 for (let i: number = this.points.length - 2; i >= 0; i--) {
-                    if (this.points[i as number] && this.points[i as number].symbolLocations[0] !== undefined) {
+                    if (this.points[i as number] && !isNullOrUndefined(this.points[this.points.length - 2].y) &&
+                        this.points[i as number].symbolLocations && this.points[i as number].symbolLocations[0] !== undefined) {
                         this.chart.markerRender.renderMarker(this, this.points[this.points.length - 2],
                                                              this.points[i as number].symbolLocations[0], null, true);
                         break;

controls/charts/src/chart/series/data-label.ts

@@ -467,7 +467,7 @@ export class DataLabel {
             !((rect.y > (clipRect.y + clipRect.height)) || (rect.x > (clipRect.x + clipRect.width)) ||
                 (rect.x + rect.width < 0) || (rect.y + rect.height < 0))) {
             rect.x = rect.x < 0 ? padding : rect.x;
-            rect.y = (rect.y < 0) && !(dataLabel.labelIntersectAction === 'None') ? padding : rect.y;
+            rect.y = (rect.y < 0 && !this.chart.requireInvertedAxis) && !(dataLabel.labelIntersectAction === 'None') ? padding : rect.y;
             rect.x -= (rect.x + rect.width) > (clipRect.x + clipRect.width) ? (rect.x + rect.width)
                 - (clipRect.x + clipRect.width) + padding : 0;
             rect.y -= (rect.y + rect.height) > (clipRect.y + clipRect.height) ? (rect.y + rect.height)

controls/charts/src/chart/series/spline-series.ts

@@ -48,9 +48,12 @@ export class SplineSeries extends SplineBase {
                         startPoint = 'L';
                     }
                     this.storePointLocation(point, series, isInverted, getCoordinate);
-                    if (direction === '') {
+                    if (direction === '' && points.length === 1) {
                         direction = 'M ' + point.symbolLocations[0].x + ' ' + point.symbolLocations[0].y;
                     }
+                    if (firstPoint === null && direction !== '' && (point.index === points.length - 1 || (points[point.index + 1] && !points[point.index + 1].visible))) {
+                        direction += 'M ' + point.symbolLocations[0].x + ' ' + point.symbolLocations[0].y + ' ';
+                    }
                 }
                 firstPoint = point;
             } else {
@@ -142,10 +145,17 @@ export class SplineSeries extends SplineBase {
             const endPathCommands: string[] = (options.d).match(/[MLHVCSQTAZ][^MLHVCSQTAZ]*/g);
             const maxLength: number = Math.max(startPathCommands.length, endPathCommands.length);
             const minLength: number = Math.min(startPathCommands.length, endPathCommands.length);
+            if (series.removedPointIndex === 0 && startPathCommands.length > endPathCommands.length && startPathCommands[2] && startPathCommands[2].indexOf('M') === 0) {
+                startPathCommands.splice(0, startPathCommands.length - endPathCommands.length);
+                points.previousDirection = startPathCommands.join('');
+            }
             if (startPathCommands.length < endPathCommands.length) {
                 for (let i: number = startPathCommands.length; i < endPathCommands.length; i++) {
                     if (endPathCommands.length !== startPathCommands.length) {
-                        if (startPathCommands[startPathCommands.length - 1].indexOf('C') === 0) {
+                        if (endPathCommands.length === startPathCommands.length + 1 && endPathCommands[endPathCommands.length - 1].indexOf('M') === 0) {
+                            startPathCommands.push(endPathCommands[endPathCommands.length - 1]);
+                        }
+                        else if (startPathCommands[startPathCommands.length - 1].indexOf('C') === 0) {
                             startPathCommands.push('L ' + ((startPathCommands[startPathCommands.length - 1]).split(' ').slice(-3)).join(' '));
                         }
                         else if (startPathCommands[startPathCommands.length - 1].indexOf('L') === 0) {