How to open Org Chart in full-screen mode on load (SharePoint Server 2019/SE)

Full-screen mode on load

To open Org Chart in full-screen mode on load, you just need to open the configuration wizard (click on gears at the top right corner of the web part and choose Settings) and switch to Custom JavaScript step:

Settings

Add the code below into code editor:

renderer.onInitialLoadingFinished(function(event){
  renderer.enableDisableFullScreen();
});
Configuration full size mode

Then finish the wizard. This script will enable a full-screen mode for your OrgChart when it loads.

Automatically scale boxes to fit visible area

For users using version 2.2.24 or higher, you can also configure your charts to automatically resize boxes to fit visible area. If you have many employees in your org chart it could look like this:

Boxes are outside

As you can see some of the boxes are outside of visible area. I will show how to automatically scale boxes to fit web part:

Boxes fit web part

Just open the configuration wizard by clicking gears at the top right corner of the web part. Then click Settings. Switch to Custom JavaScript step and put the code below into code editor:

renderer.onInitialLoadingFinished(function () {

  renderer.showLoadingPanel();

  var $pochContent = renderer.querySelector(".poch-content")
  var $viewPort = renderer.querySelector(".poch-control").children().first();
  var viewPort = $viewPort[0];
  var topOffset = 20;
  var currentZoom = 1;

  function adjustWidth() {

    var realViewPortWidth = viewPort.scrollWidth * currentZoom;
    var contentWidth = $pochContent.width();

    if (realViewPortWidth > contentWidth) {

      currentZoom = currentZoom - 0.1;
      if (currentZoom > 0) {
        renderer.zoom(currentZoom);
        adjustWidth();
      }
    } else {
      renderer.hideLoadingPanel();
      renderer.dataProvider.getRootItemId(function (rootId) {
        renderer.scrollToBox(rootId);
      });
    }
  }

  setTimeout(adjustWidth, 50);

});

Then finish the wizard. This script calculates visible area, and resizes org chart until it fits width of visible area.