Zoom and Center canvas on an object

[Mit]

Hi,

I want to achieve this:

1) I have an object stored in the database and renders on load. And I want when diagram loads it zooms and center on that particular object.
2) I already have object found using ID. I can already zoom using one of your knowledge base article.
3) Issue is when I zoom, even the object can be fit on the diagram, it is not centered in the diagram. So I want to achieve it before zooming.

Regards,

[Shyam G]

Hi Mit, 

Query	Response
1) I have an object stored in the database and renders on load. And I want when diagram loads it zooms and center on that particular object.	We suggest you to use zoom  “focusPoint” property to achieve your requirement. Please refer the code example and help documentation below.  Code example:  function zoomin() {                             var diagram = $("#Diagram1").ejDiagram("instance");              var node = diagram.model.selectedItems.children[0];              var zoom1 = ej.datavisualization.Diagram.Zoom();              if(node)                  zoom1.focusPoint = { x: node.offsetX, y: node.offsetY };              diagram.zoomTo(zoom1);          }  Help documentation link:https://help.syncfusion.com/aspnet/diagram/commands#zoom
Issue is when I zoom, even the object can be fit on the diagram, it is not centered in the diagram. So I want to achieve it before zooming.	Please use diagram’s client side API method bringToCenter which brings the specified rectangular region of the diagram content to the center of the view port. Please refer to the code example and help documentation below.  Code example:  <script>   $(window).load(function () {  var diagram=$("#diagramcontent").ejDiagram("instance");   diagram.bringToCenter(ej.datavisualization.Diagram.Rectangle(700, 500, 80, 80));   });  </script>    Help documentation:  https://help.syncfusion.com/js/api/ejdiagram#methods:bringtocenter

 

Regards, 

Shyam G