with Print and export diagram, annotations are empty

[Laurent]

Hi,

I am using the print and export methods of a diagram :

    let printOptions = {

            mode: 'Data',

            region: 'PageSettings',

            margin: { left: 0, top: 0, bottom: 0, right: 0 }

        };

        this.diagram.print(printOptions);

If I see the nodes and the connectors, the annotations are empty (see the picture below):

I am using the setNodeTemplate method of the diagram to annotate the nodes:

function setNodeTemplate(obj) {

    obj.style = { fill: obj.Color, color: 'white' };

    obj.annotations = [

        {

            width: 200,

            height: 80,

            template: obj.Description,

            margin: { left: 3, top: 0, bottom: 1 }

        }

    ];

    obj.constraints = ej.diagrams.NodeConstraints.Default & ~ej.diagrams.NodeConstraints.Rotate & ~ej.diagrams.NodeConstraints.Resize & ~ej.diagrams.ConnectorConstraints.Delete;

}

Do you have any clue?

Regards,

Laurent 

[Gowtham Gunashekar]

Hi Laurent, 

 

On the further analysis of the shared details, we can be able to see that the diagram contains the contains HTML annotation template and  you have tried to print the diagram. Usually when we try to print the diagram the browser will raise a popup, we need to allow that to print the diagram and we suggest you use the Syncfusion Essential PDF library, which supports HTML Content to Image conversion by using the advanced Qt WebKit rendering engine, to export the HTML and Native node as the Image and it is feasible to use on Windows and macOS. We have already prepared a KB for How to print or export the HTML and Native node and annotation template node into image format. So, by using the KB you can export the diagram with HTML template. Please find the KB in the link below      

    

KB: https://www.syncfusion.com/kb/10213/how-to-print-or-export-the-html-and-native-node-into-image-format      

    

It’s the only way to export the native and html node into image.    

    

    

If we misunderstood your requirement, please share us more details provide a simple sample to replicate the reported issue. This will be helpful for us to proceed further. 

 

Regards,   

Gowtham