syncfusion/ej2-javascript-ui-controls

rotatedDataLabelCollections is null when passing in container as a parameter for Charts Constructor.

kevinsar opened this issue · 2 comments

kevinsar commented

I ran into this random issue and it was quite frustrating until I figured out the issue.

I had a chart built for a while using this basic syntax for appending my chart to my site:

new Chart(chartConfig, '#element');

it was working perfectly fine for a while until I got a ticket to rotate my datalabel marker. I saw the pretty simple example and tried it and kept getting an error that rotatedDataLabelCollections was undefined.

I tried using this example config that I saw in the official demos:

{
        //Initializing Primary X and Y Axis
        primaryXAxis: {
            valueType: 'Category', 
            interval: 1
        },
        chartArea: { border: { width: 0 } },
        primaryYAxis:
        {
          maximum:60
        },
        //Initializing Chart Series
        series: [
            {
                type: 'Column', xName: 'x', width: 2, yName: 'y', name: 'Gold',
                dataSource: [
                { x: 'USA', y: 46 }, 
                { x: 'GBR', y: 27 }, 
                { x: 'CHN', y: 26 }],
                marker: { dataLabel: { 
                visible: true,
                angle: 45,
                enableRotation: true
                 } 
                 },                 
            }            
        ],      
        
        width: Browser.isDevice ? '100%' : '60%',
        title: 'Olympic Medal Counts - RIO'
    }

with the same exact package versions and that didn't work either. Finally I saw that the appending was happening on a different line, I didn't think to try it but I figured I might as well and this syntax worked just fine:

const chart = new Chart(chartConfig, '#element'); 
chart.appendTo('#element');

Not sure why this is the syntax needed since other demos just pass the container as a second param in the constructor. Made it confusing.

Swetha-Babu commented

Hi Kevin,

Greetings from Syncfusion.

We have created the simple javascript sample using the provided code snippet in our latest version (v19.4.48) and are unable to reproduce the reported issue. Please find the below stackblitz link for your sample reference,

Sample link: https://stackblitz.com/edit/padnpa

Kindly, revert us if you have any concerns.

Regards,
Swetha

syncsiva commented

This issue has not had any activity for 2 weeks. Closing for housekeeping purposes. Please feel free to reopen it if you have more information that can help us investigate the issue further.