v19.1.67 is released

Author: pipeline

controls/barcodegenerator/CHANGELOG.md

@@ -2,7 +2,7 @@
 
 ## [Unreleased]
 
-## 19.1.66 (2021-06-01)
+## 19.1.67 (2021-06-08)
 
 ### Barcode
 

controls/base/CHANGELOG.md

@@ -2,7 +2,7 @@
 
 ## [Unreleased]
 
-## 19.1.66 (2021-06-01)
+## 19.1.67 (2021-06-08)
 
 ### Common
 

controls/calendars/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@syncfusion/ej2-calendars",
-	"version": "19.1.64",
+	"version": "19.1.66",
 	"description": "A complete package of date or time components with built-in features such as date formatting, inline editing, multiple (range) selection, range restriction, month and year selection, strict mode, and globalization.",
 	"author": "Syncfusion Inc.",
 	"license": "SEE LICENSE IN license",

controls/charts/CHANGELOG.md

@@ -2,10 +2,22 @@
 
 ## [Unreleased]
 
+## 19.1.67 (2021-06-08)
+
+### Chart
+
+#### Bug Fixes
+
+- `#F165670` - Marker Explode is now rendered properly with image.
+- `#328528` - Histogram is rendering properly when the `binInterval` value is 0.
+- `#328780` - `multiLevelLabelClick` event is now triggering in canvas mode.
+
 ## 19.1.65 (2021-05-25)
 
 ### Chart
 
+### Stock Chart
+
 #### Bug Fixes
 
 - `#F165171` - Tooltip for column in stock chart is working properly now.

controls/charts/spec/range-navigator/issue-fix/range-issue.spec.ts

@@ -59,5 +59,15 @@ describe('Range Navigator Issue fixes', () => {
             rangeControl.series = [{ dataSource: new DataManager(data), xName: 'x', yName: 'y' }];
             rangeControl.refresh();
         });
+        it('checking with background color', (done: Function) => {
+            rangeControl.loaded = (args: IRangeLoadedEventArgs) => {
+                rangeElement = document.getElementById('rangeContainer_ChartBorder');
+                expect(rangeElement.getAttribute("fill")).toEqual("red");
+                done();
+            };
+            rangeControl.background = 'red';
+            rangeControl.refresh();
+        });
+		
     });
 });

controls/charts/src/chart/axis/multi-level-labels.ts

@@ -11,7 +11,7 @@ import { Axis } from '../axis/axis';
 import { FontModel } from '../../common/model/base-model';
 import { isNullOrUndefined } from '@syncfusion/ej2-base';
 import { textWrap, appendClipElement, appendChildElement } from '../../common/utils/helper';
-import { valueToCoefficient, textTrim, textElement } from '../../common/utils/helper';
+import { valueToCoefficient, textTrim, textElement, withInBounds } from '../../common/utils/helper';
 import { Size, measureText, TextOption, PathOption, Rect, SvgRenderer } from '@syncfusion/ej2-svg-base';
 import { MultiLevelLabels, MultiLevelCategories } from '../model/chart-base';
 import { IAxisMultiLabelRenderEventArgs, IMultiLevelLabelClickEventArgs } from '../../chart/model/chart-interface';
@@ -38,6 +38,10 @@ export class MultiLevelLabel {
     public multiElements: Element;
     /** @private */
     public labelElement: Element;
+    /** @private */
+    public multiLevelLabelRectXRegion: Rect[] = [];
+    /** @private */
+    public xLabelCollection: TextOption[] = [];
     /**
      * Constructor for the logerithmic module.
      *
@@ -170,6 +174,11 @@ export class MultiLevelLabel {
                         this.chart.renderer, options, argsData.textStyle, argsData.textStyle.color || this.chart.themeStyle.axisLabel,
                         this.labelElement, false, this.chart.redraw, true, null, null, null, null, null, this.chart.enableCanvas
                     );
+                    if (this.chart.enableCanvas) {
+                        let textSize: Size = measureText(argsData.text, argsData.textStyle);
+                        this.multiLevelLabelRectXRegion.push(new Rect(options.x, options.y, textSize.width, textSize.height));
+                        this.xLabelCollection.push(options);
+                    }
                     if (multiLevel.border.width > 0 && multiLevel.border.type !== 'WithoutBorder') {
                         pathRect = this.renderXAxisLabelBorder(
                             level, endX - startX - padding, axis, startX, startY, labelSize, options, axisRect, argsData.alignment,
@@ -511,11 +520,20 @@ export class MultiLevelLabel {
      * @private
      */
     public click(event: Event): void {
-        const targetId: string = (<HTMLElement>event.target).id;
+        let targetId: string = (<HTMLElement>event.target).id;
         const multiLevelID: string = '_Axis_MultiLevelLabel_Level_';
         let textId: string;
         let elementId: string;
         let axisIndex: number;
+        if (this.chart.enableCanvas) {
+            for (let i: number = 0; i < this.multiLevelLabelRectXRegion.length; i++) {
+                if (withInBounds(
+                    event['x'], event['y'], this.multiLevelLabelRectXRegion[i],
+                    this.multiLevelLabelRectXRegion[i].width, this.multiLevelLabelRectXRegion[i].height)) {
+                        targetId = this.xLabelCollection[i].id;
+                    }
+            }
+        }
         if (targetId.indexOf(multiLevelID) > -1) {
             textId = targetId.split(multiLevelID)[1];
             elementId = targetId.split(multiLevelID)[0];

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

@@ -41,7 +41,7 @@ export class HistogramSeries extends ColumnSeries {
         series.histogramValues.mean = mean;
         series.histogramValues.sDValue = Math.round(Math.sqrt(sumValue / yValues.length - 1));
         series.histogramValues.binWidth = series.binInterval ||
-            Math.round((3.5 * series.histogramValues.sDValue) / Math.pow(yValues.length, 1 / 3));
+            Math.round((3.5 * series.histogramValues.sDValue) / Math.pow(yValues.length, 1 / 3)) || 1;
     }
     /**
      * Add data points for Histogram series.

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

@@ -192,7 +192,7 @@ export class MarkerExplode extends ChartData {
                 i ? borderColor : markerShadow,
                 (marker.opacity || seriesMarker.opacity), null, null
             );
-            const symbol: Element = drawSymbol(location, shape, size, seriesMarker.imageUrl, options, '',
+            const symbol: Element = drawSymbol(location, shape, size, marker.imageUrl, options, '',
                                                this.chart.svgRenderer, series.clipRect);
             // incident: 252450 point click selection not working while maker explode
             //symbol.setAttribute('style', 'pointer-events:none');

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

@@ -121,6 +121,7 @@ export class Marker extends MarkerExplode {
             const markerHeight: number = argsData.point.marker.height || argsData.height;
             const markerOpacity: number = argsData.point.marker.opacity || marker.opacity;
             const markerShape: ChartShape = argsData.point.marker.shape || argsData.shape;
+            const imageURL : string = argsData.point.marker.imageUrl || marker.imageUrl;
             shapeOption = new PathOption(
                 symbolId, markerFill, markerBorder.width, markerBorder.color, markerOpacity, null
             );
@@ -136,7 +137,7 @@ export class Marker extends MarkerExplode {
                 markerElement = drawSymbol(
                     location, markerShape,
                     new Size(markerWidth, markerHeight),
-                    marker.imageUrl, shapeOption,
+                    imageURL, shapeOption,
                     point.x.toString() + ':' + y.toString(), this.chart.renderer, series.clipRect
                 );
                 appendChildElement(
@@ -146,7 +147,7 @@ export class Marker extends MarkerExplode {
             }
             point.marker = {
                 border: markerBorder, fill: markerFill, height: markerHeight,
-                visible: true, shape: markerShape, width: markerWidth
+                visible: true, shape: markerShape, width: markerWidth, imageUrl: imageURL
             };
         } else {
             location = null;

controls/charts/src/chart/utils/get-data.ts

@@ -210,7 +210,7 @@ export class ChartData {
     public getClosest(series: Series, value: number, xvalues?: number[]): number {
         let closest: number; let data: number;
         const xData: number[] = xvalues ? xvalues : series.xData;
-        if (value >= <number>series.xAxis.visibleRange.min && value <= <number>series.xAxis.visibleRange.max) {
+        if (value >= <number>series.xMin - 0.5 && value <= <number>series.xMax + 0.5) {
             for (let i: number = 0; i < xData.length; i++) {
                 data = xData[i];
                 if (closest == null || Math.abs(data - value) < Math.abs(closest - value)) {