Text(annotation) width is not getting set for nodes in diagram

[Rohit Swarup]

Refer the highlighted node in attached diagram above, We want to add ellipsis to the text which is present inside node, we tried adding "width" property in style object but still it is not getting set.

Please refer the code snippet for same-

It would be great help if any solution is provided such that long texts will be clearly visible inside node with ellipses and proper padding.

[Balasubramanian Manikandan]

In your sample, you have defined annotation width inside the style property. So only the width is not working. You should define width in annotation object. We have created a sample in which we have defined annotation width and ellipsis. Refer to the below mentioned code example and sample.

Code Snippet:

annotations: [

        {

          content: 'diagram control in the syncfusion',

          offset: { x: 0.5, y: 0.5 },

          verticalAlignment: 'Bottom',

          style: {

            textOverflow: 'Ellipsis',

            textWrapping: 'NoWrap',

          },

          width: 50,

        },

      ],

Sample:

https://stackblitz.com/edit/angular-ruv7j2-oekzew?file=app.component.ts,app.component.html