Error in the console for accumulationChart

[Amos]

Hi

I have the following code in a method that is executed when the window opens up, after calling an API:

<ejs-accumulationchart ....

selectionMode="Point"

:selectedDataIndexes="totalsSelected"

method() {

if (item != "test") {

this.totalsSelected = [{ series: 0, point: Object.keys(this.user.items).indexOf(this.user.item) }];

    this.$refs.totalsChart.ej2Instances.refresh();

}

}

purpose: If the user selected a slice/item in a pie, went to a different screen and then comes back, I want the same selected slice/item to be re-selected. At the moment this code is executed anyway so my 1st question would be: How can I know if and what is the current selected slice of a pie?

Now for the errors, though I'm not sure they are related to the above (I think it is):

I see the following error in the console, which is coming from selection.js: Uncaught TypeError: Cannot read property 'point' of undefined

AccumulationSelection.prototype.removeStyles = function (elements, index) {
        var accumulationTooltip = this.control.accumulationTooltipModule;
        var legendShape;
        for (var _i = 0, elements_2 = elements; _i < elements_2.length; _i++) {
            var element = elements_2[_i];
            if (element) {
                if (this.control.accumulationLegendModule && this.control.legendSettings.visible) {
                    legendShape = document.getElementById(this.control.element.id + '_chart_legend_shape_' + index.point);
                    this.removeSvgClass(legendShape, this.getSelectionClass(legendShape.id));
                }
                var opacity = accumulationTooltip && (accumulationTooltip.previousPoints[0].point.index === index.point) ?
                    accumulationTooltip.svgTooltip.opacity : this.series[index.series].opacity;
                element.setAttribute('opacity', opacity.toString());
                this.removeSvgClass(element, this.getSelectionClass(element.id));
            }
        }
    };

The problem: accumulationTooltip.previousPoints is 0 length so the above throws an error. I don't know what previousPoints represents.

I see the following error in the console which is coming from accumulation-base.js: Error: <text> attribute transform: Expected transform function, "translate(0, 0)undefined".

AccumulationBase.prototype.setElementTransform = function (id, position) {
        var element = getElement(id);
        if (element) {
            element.setAttribute('transform', position); <<<<< the error is coming from this line
        }
    };

Please advice

Thanks

[Durga Gopalakrishnan]

Hi Amos, 

 

We have analyzed your query. By default, you can get the selected points using selectedDataIndexes property or selection class applied for element. We have prepared sample for your reference. Since we are not clear about your exact query, please provide us issue reproducing sample or code snippet with full configurations, which will be helpful for further analysis. 

 

Sample 

https://codesandbox.io/s/ancient-violet-e7oqq 

 

Kindly revert us, if you have any concerns. 

 

Regards, 

Durga G 

[Amos]

I did the following

                        if (this.user.item != "All Items") {

                            var currentPoint = -1;

                            if (

                                this.p$refs.totalsChart.ej2Instances.accumulationSelectionModule.selectedDataIndexes.length == 0 ||

                                this.$refs.totalsChart.ej2Instances.accumulationSelectionModule.selectedDataIndexes[0].point !=

                                    Object.keys(this.user.items).indexOf(this.user.item)

                            )

                                currentPoint = Object.keys(this.user.items).indexOf(this.user.item);

                            if (currentPoint != -1) {

                                this.totalsSelected = [{ series: 0, point: currentPoint }];

                                this.$refs.totalsChart.ej2Instances.refresh();

                            }

                        }

Explanation in short:

If the user clicks on a slice, then I do nothing because the pie handles it by itself (explode slice): OK

If the user clicks on an already selected slice, I do nothing because the pie handles it by itself (unexplode slice): OK

If the user clicks on a slice, goes to another page and then comes back, I want the previous selected slice to explode.

1. I see console errors like I posted previously coming from selection.js (your code) about previousPoints.

2. The refresh doesn't force a redraw of the pie. How do I know? Because if I press f12 to open the browser panel,

that forces the pie to redraw and then the slice is exploded as it should be.

So my questions:

1. It looks like there is an issue with previousPoints object, my original post shows a more detailed explanation about it.

2. does refresh draws the pie or if there was no change in the underline data, it stays as it was? If the latter, how can I

force a redraw of the pie?

Thanks

[Durga Gopalakrishnan]

Hi Amos, 

We are validating your reported scenario. We will update the status within one business day(9^th June, 2020). We appreciate your patience until then. 

Regards, 

Durga G 

[Durga Gopalakrishnan]

Hi Amos, 

We will discuss about the reported issue in an incident which you have created under your direct trac account.  

Regards, 

Durga G