error in SF documentation example

[Luigi Grasso]

please refer to

https://ej2.syncfusion.com/javascript/documentation/diagram/group/

the example referring to "Difference between a basic group and containers" in subsection "The following code illustrates how to add a stack panel."

doenst work as expected on FireFox 86.0 nor on Chrome

see picture in attachment

__________________________________________________________________

code referenced

var nodes = [{
    id: 'node5',
    width: 100,
    height: 100,
    offsetX: 100,
    offsetY: 100,
    style: {
        strokeColor: '#6BA5D7',
        fill: '#6BA5D7'
    },
    annotations: [{
        content: 'Custom Template',
        offset: {
            y: 1
        },
        verticalAlignment: 'Top'
    }]
}, ];
var getTextElement = function(text) {
    var textElement = new ej.diagrams.TextElement();
    textElement.width = 50;
    textElement.height = 20;
    textElement.content = text;
    return textElement;
};
var addRows = function(column) {
    column.children.push(getTextElement('Row1'));
    column.children.push(getTextElement('Row2'));
    column.children.push(getTextElement('Row3'));
    column.children.push(getTextElement('Row4'));
};
var diagram = new ej.diagrams.Diagram({
    width: 900,
    height: 900,
    nodes: nodes,
    setNodeTemplate: function(obj, diagram) {
        if (obj.id.indexOf('node5') !== -1) {
            var table = new ej.diagrams.StackPanel();
            table.orientation = 'Horizontal';
            var column1 = new ej.diagrams.StackPanel();
            column1.children = [];
            column1.children.push(getTextElement('Column1'));
            addRows(column1);
            var column2 = new ej.diagrams.StackPanel();
            column2.children = [];
            column2.children.push(getTextElement('Column2'));
            addRows(column2);
            table.children = [column1, column2];
            return table;
        }
        return null;
    },
}, '#element');

Attachment: Untitled_Diagram(SF)_eca0a277.zip

[Gowtham Gunashekar]

Hi Luigi, 

 

We have added a sample link to demonstrate how to render a templet in the setNodeTemplate and we can able to replicate the reported issue from our side we will fix and It will be included in any of our upcoming releases.  

 

Sample Link: https://stackblitz.com/edit/feum4b-voehqg?file=index.js 

 

 

Regards, 

Gowtham