Center the shapes and position the connectors to the top

[Naveen]

I have Circle as my first shape. But when I align the circle to the center by adding it in a rect layout the connector from the circle is still in the same position as it is now, pointing from nowhere. how do I align the Circle to center and the connector should also be from the center of the circle.?

I need the connectors at a fixed position on all shapes. eg. top-center. In the image I have attached you can see that the some connectors go to the side and some to the top. When there are more steps, its difficult to follow the flow and in most cases the connectors are overlapping. ie the from and to connector of a shape is merged together. how to make sure, I have different from and to connectors for each shape.? 

Any help is appreciated. thanks in advance. I hope this does not require any sample code.

[Boyan Dimitrov]

Hello,

I would suggest to take a look at the layout documentation that provides information about arranging the shapes. 

Also the viewPort method of the Kendo UI Diagram returns the bounds of the diagramming canvas. This might help you to find the coordinates of the center position and position the circle shape in the middle. 

Regards,
Boyan Dimitrov
Telerik by Progress

[Naveen]

Thanks @Boyan .. Another issue I am facing is, the diagram is not taking up the width of the parent div.. I am not able to give 100% and by default it takes 600px as width.. If I specify lesser width only half of the diagram is visible.. I also need to center the diagram to center of the parent div. How would I do that ? When I give bringInToView, since the width is 600px, it is not aligned to the center of the parent div.. Kindly help me out.. 

[Naveen]

Please let me know from where does the div with class k-layer get its width.. ?

[Boyan Dimitrov]

Hello Naveen,

It takes it from the viewPort method or set them to 600 pixels as default value. 

Regards,
Boyan Dimitrov
Telerik by Progress