Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Vertical Display of Leaves in Org Chart #47

Open
orwant opened this issue May 9, 2015 · 79 comments
Open

Vertical Display of Leaves in Org Chart #47

orwant opened this issue May 9, 2015 · 79 comments

Comments

@orwant
Copy link
Collaborator

orwant commented May 9, 2015

What would you like to see us add to this API?

I would like to see the ability for the Org Chart to display leaf nodes
both horizontally and vertically.  Currently, the Org Chart only supports
horizontal layout.  But to save space (especially for printing), it would
be nice if the leaf nodes (nodes without children) would all display
directly below their parent with their connector line attaching to the box
on the left side.

What component is this issue related to (PieChart, LineChart, DataTable,
Query, etc)?

Org Chart

*********************************************************
For developers viewing this issue: please click the 'star' icon to be
notified of future changes, and to let us know how many of you are
interested in seeing it resolved.
*********************************************************

Original issue reported on code.google.com by khenneman on 2009-09-08 18:15:40

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

What would be needed to increase the priority of this item?

Original issue reported on code.google.com by pmail.tmail on 2010-01-20 15:28:47

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

I am using the org chart in SharePoint. I have done some tweaking to make the org 
chart look better. For example, when the parent node collapses, remove all the white

spaces below the parent node (ie condense the chart). But, still for org chart with

many child nodes (> 10), you have to go across the page to view the child nodes.

My suggestion is to provide the option to make the child nodes display vertically 
when you reach certain level in the chart.

This feature is highly desirable by our company.

Thank you!

Original issue reported on code.google.com by Hossein.FLorida on 2010-02-26 20:47:40

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

Radial Tree is better.  Vertical should be cake, the sooner the better.

Original issue reported on code.google.com by dan.mcdanielar.com on 2010-03-26 06:55:06

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

Need to display Org Charts vertically,it will space log of space incase if we have
lot of data need to be shown,Please let me know if anything similar to this.

regards
Gangadhar

Original issue reported on code.google.com by maligangadhar.m on 2010-05-11 09:04:21

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

This Org Chart component works very well for a small department or organization. It

really would benefit from the ability to display leaf nodes vertically. If there is

a manager with 15 direct reports (none of whom have people reporting to them), then

the option to display those folks vertically would keep the overal chart from being

too wide.

Original issue reported on code.google.com by johnmvincent on 2010-05-21 14:33:07

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

need to display org charts vertically,since i have lot of data when it was showned
horizantally page is getting wider and wider....... any help on this ......


need to disply in vettically ....plz refer in attachment..

Original issue reported on code.google.com by maligangadhar.m on 2010-05-25 12:12:22


- _Attachment: [d.JPG](https://storage.googleapis.com/google-code-attachments/google-visualization-api-issues/issue-47/comment-6/d.JPG)_

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

Bump this priority up! Found this tool extremely useful but became way too wide on the
page. Vertical display when no direct reports or fully vertical flow would be ideal...

As a backup solution, I was able to get this to display vertically with some javascript.
1) Idetify if the person has any direct reports.
2) If they dont, have them "report" to the top most person under that manager. 
I accomplished this by having an array of Associate/Manager. I sorted my manager. When
I sent the Associate/Manager rows to the chart, I checked if the associates had any
direct reports. If they didnt, the first person I had report to the manager, then everyone
else I had them report to the person above them--associate -1.

Hope to see this as a function though...

Original issue reported on code.google.com by marcusperez on 2010-10-21 17:09:58

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

I see that the priority of this has been set to LOW, but for a company that has 500
employees, the priority needs to be raised.  You have to scroll forever to see the
employees, and don't even try to print it.  Isn't there something that can be done
here?

Marcus, would you care to share?

Original issue reported on code.google.com by khenneman on 2010-11-22 13:01:42

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

I found something similar here http://code.google.com/intl/ro-RO/apis/visualization/documentation/gallery/orgchart.html

Original issue reported on code.google.com by seimour.birkoff on 2010-11-22 13:17:12

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

Sure, let’s see... Don’t have time to explain much but maybe the code posted might help.
It uses jQuery so if you haven’t referenced that, be sure to.

-------------
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<script type="text/javascript">
function theDo(){
    var theArray = new Array();
    //These next two should be an already sorted (on manager) pair of Associate/Managers

    var colAssociate = $('.theAssociate'); //collection of associates
    var colManager = $('.theManager'); //collection of their respective managers.   //Next,
loop through everyone. "Trick" the org chart to place them differently if they have
multiple reports
    for( var i = 1 ; i < colAssociate.length ; i++ ) { 
        if( colManager.find(':contains("' + colAssociate[i].innerText + '")').length == 0
&&
                colManager[i].innerText == colManager[i-1].innerText ) { 
            theArray[theArray.length] = [colAssociate[i].innerText , colAssociate[i-1].innerText
 ]; //Report to the last person reporting to the manager causing the downward look
        } else {
            theArray[theArray.length] = [colAssociate[i].innerText , colManager[i].innerText
]; //Report to the manager
        }
    }
    drawChart2(theArray); //do the regular chart drawing
}

function drawChart2(theArray) {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Name');
    data.addColumn('string', 'Manager');
    data.addRows(theArray);
    var chart = new google.visualization.OrgChart(document.getElementById('chart_div'));
    chart.draw(data, {allowHtml:true});
}
</script>
-------------

Slow on large orgs but does the trick :)

Original issue reported on code.google.com by marcusperez on 2010-12-07 01:24:47

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

Marcusperez, thank you for sharing your code, but I was unable to get it to work. I
totally understand being unable to explain it, but could you post a complete working
sample?

For example, when is theDo() called?
is it --  google.setOnLoadCallback(theDo);

You don't show any sample data, etc.




Original issue reported on code.google.com by johnmvincent on 2010-12-07 16:03:13

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

Sure, just add this to your body:


    <div class="theAssociate">Manager1</div>
    <div class="theManager"></div>

    <div class="theAssociate">Lacky1</div>
    <div class="theManager">Manager1</div>

    <div class="theAssociate">Lacky2</div>
    <div class="theManager">Manager1</div>

    <div class="theAssociate">Lacky3</div>
    <div class="theManager">Manager1</div>

Original issue reported on code.google.com by marcusperez on 2010-12-08 20:54:48

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

Full working code:

<html>

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type='text/javascript' src='http://www.google.com/jsapi'></script>

<script type="text/javascript">
google.load('visualization', '1', {packages:['orgchart']});
//google.setOnLoadCallback(drawChart2);


function theDo(){
    var theArray = new Array();
    //These next two should be an already sorted (on manager) pair of Associate/Managers

    var colAssociate = $('.theAssociate'); //collection of associates
    var colManager = $('.theManager'); //collection of their respective managers.   //Next,
loop through everyone. "Trick" the org chart to place them differently if they have
multiple reports
    for( var i = 1 ; i < colAssociate.length ; i++ ) { 
        if( colManager.find(':contains("' + colAssociate[i].innerText + '")').length == 0
&&
                colManager[i].innerText == colManager[i-1].innerText ) { 
            theArray[theArray.length] = [colAssociate[i].innerText , colAssociate[i-1].innerText
 ]; //Report to the last person reporting to the manager causing the downward look
        } else {
            theArray[theArray.length] = [colAssociate[i].innerText , colManager[i].innerText
]; //Report to the manager
        }
    }
    drawChart2(theArray); //do the regular chart drawing
}

function drawChart2(theArray) {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Name');
    data.addColumn('string', 'Manager');
    data.addRows(theArray);
    var chart = new google.visualization.OrgChart(document.getElementById('chart_div'));
    chart.draw(data, {allowHtml:true});
}
</script>

</head>

<body onload="theDo()">

<div class="theAssociate">Manager1</div>
<div class="theManager"></div>

<div class="theAssociate">Lacky1</div>
<div class="theManager">Manager1</div>

<div class="theAssociate">Lacky2</div>
<div class="theManager">Manager1</div>

<div class="theAssociate">Lacky3</div>
<div class="theManager">Manager1</div>

<div id='chart_div'></div>
</body>

Original issue reported on code.google.com by marcusperez on 2010-12-08 21:00:26

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

That's not really what I was looking for.  Yes, the leaves need to be vertical, however,
the connector lines need to go down the left or right side, not down the middle.  In
your example above, it looks like Manager1 is the manager of Lacky1, Lacky1 is the
manager of Lacky2, and Lacky2 is the manager of Lacky3, when in fact, Manager1 is over
Lacky1, Lacky2 and Lacky3.

Original issue reported on code.google.com by khenneman on 2010-12-08 21:10:26

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

Seimour,
The link you provided is the Org Chart that we are discussing here.  The only web browser
that I've found to support more than 999 in a colspan is Google Chrome, go figure...
 Maybe that's why they're not fixing it.

Original issue reported on code.google.com by khenneman on 2010-12-08 21:14:13

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

These steps can make the org chart go vertical pretty easily.  This method seems to
work pretty well with little effort.

This potentially could work for all browsers.  I haven't done lots of investigation
on that.  I'm assuming the user is using the small org chart.

Add these styles to the container used for the org chart:
#my_chart {
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
transform: rotate(-90deg);
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
float:left;
height:1800px; /* this should be the css value from the chart's width. you could set
this programmatically with javascript or just take a good guess */
}

add an element after your container to fix the float issue like <br style="height:1%;clear:both"
/>

add these css class styles:
.google-visualization-orgchart-node {
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
transform: rotate(90deg);
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
/* another way to shrink the chart is to use a smaller font which can be styled in
this class */
}

.google-visualization-orgchart-space-small {
/* adjust this height as needed since this is really based on the width of your tree's
root element */
height:20px;
}

.google-visualization-orgchart-connrow-small {
/* again this will vary base on how wide your elements are */
height:42px;
}

Original issue reported on code.google.com by j.saterfiel on 2011-03-04 05:12:35


- _Attachment: org_chart_vertical.png
![org_chart_vertical.png](https://storage.googleapis.com/google-code-attachments/google-visualization-api-issues/issue-47/comment-16/org_chart_vertical.png)_

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

Dear j.saterf... ,
this sounds very interesting. I would like to use your code with the org-chart API.

I tried to get the code from google running 90 degrees rotated. But adding the webkit
rotate(-90) doesn't have any effect if used in the header of my html-file.
What's my container if i using the following code:
http://code.google.com/intl/de/apis/visualization/documentation/gallery/orgchart.html

In this code example, there aren't css files supported or included. Where should i
reference to the i.e. ".google-visualization-orgchart-node" class in this example?

I tried the following implementation but didn't get a satisfying chart, i get a blank
page :-D
I hope you are able to help ;-)
Thanks !

<html>
  <head>
    <script type='text/javascript' src='https://www.google.com/jsapi'></script>
    <script type='text/javascript'>
      google.load('visualization', '1', {packages:['orgchart']});
      google.setOnLoadCallback(drawChart);
      -webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
transform: rotate(-90deg);
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
float:left;
height:1800px; /* this should be the css value from the chart's width. you could set
this programmatically with javascript or just take a good guess */
      function drawChart() {
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Name');
        data.addColumn('string', 'Manager');
        data.addColumn('string', 'ToolTip');
        data.addRows([
          [{v:'Mike', f:'Mike<div style="color:red; font-style:italic">President</div>'},
'', 'The President'],
          [{v:'Jim', f:'Jim<div style="color:red; font-style:italic">Vice President</div>'},
'Mike', 'VP'],
          ['Alice', 'Mike', ''],
          ['Bob', 'Jim', 'Bob Sponge'],
          ['Carol', 'Bob', '']
        ]);
        var chart = new google.visualization.OrgChart(document.getElementById('chart_div'));
        chart.draw(data, {allowHtml:true});
      }
      .google-visualization-orgchart-node {
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
transform: rotate(90deg);
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
/* another way to shrink the chart is to use a smaller font which can be styled in
this class */
}

.google-visualization-orgchart-space-small {
/* adjust this height as needed since this is really based on the width of your tree's
root element */
height:20px;
}

.google-visualization-orgchart-connrow-small {
/* again this will vary base on how wide your elements are */
height:42px;
}

    </script>
    <br style="height:1%;clear:both" />
  </head>
  <body>
    <div id='chart_div'></div>
  </body>
</html>

Original issue reported on code.google.com by andi.schmid1210 on 2011-03-15 09:19:45

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

The solution j.saterf... provides is interesting! But, is there why to make the children
under the node go vertical if let say there is more than 2 children? See attached.
If I were to use j.saterf... solution for nodes with more than 2 children then some
of the children will be leveled higher than their parent.

Original issue reported on code.google.com by Hossein.FLorida on 2011-03-21 16:22:56


- _Attachment: orgchart.png
![orgchart.png](https://storage.googleapis.com/google-code-attachments/google-visualization-api-issues/issue-47/comment-18/orgchart.png)_

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

This is a continuation of my previous comment. 

Original issue reported on code.google.com by Hossein.FLorida on 2011-03-21 16:26:21


- _Attachment: orgchart_bad.png
![orgchart_bad.png](https://storage.googleapis.com/google-code-attachments/google-visualization-api-issues/issue-47/comment-19/orgchart_bad.png)_

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

Hossein,

The orgchart.png that you included (in comment 18) is exactly what I was originally
looking for when I first created this thread.

Kris

Original issue reported on code.google.com by khenneman on 2011-03-21 18:50:04

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

I like the rotate idea. If this could simply be added as a parameter to orgchart i.e.
rotate=-90 or -180 or 90 this would be fantastic! I'm trying to create pedigree charts
for a friend in a way that they can maintain them (the start with the child on the
left and both sets of parents to the right of the child) the following addRows makes
their maintenance easy using orgchart, but the direction is wrong. I'd love for this
to get a higher priority since the rotated version could also be used for geneology
as well.  

data.addRows([
          [{v:'lvl1', f:'<a href="www.amadha.ca/index.html">Mike</a><div style="color:red;
font-style:italic">CJfK</div>'}, '', ''],
          [{v:'lvl2m', f:'<a href=""></a>Sue (m)<div style="color:red; font-style:italic">Oxford</div>'},
'lvl1', ''],
          [{v:'lvl2s', f:'<a href=""></a>Frank (s)<div style="color:red; font-style:italic">CJfK</div>'},
'lvl1', ''],
          [{v:'lvl2m3m', f:'<a href=""></a>Alice (m)<div style="color:red; font-style:italic">CJfK</div>'},
'lvl2m', ''],
          [{v:'lvl2m3s', f:'<a href=""></a>Ted (s)<div style="color:red; font-style:italic">CJfK</div>'},
'lvl2m', ''],
          [{v:'lvl2s3m', f:'<a href=""></a>Molly (m)<div style="color:red; font-style:italic">Fancy
Seats</div>'}, 'lvl2s', ''],
          [{v:'lvl2s3s', f:'<a href=""></a>Bob (s)<div style="color:red; font-style:italic">Rolling
Hills</div>'}, 'lvl2s', ''],
      [{v:'lvl2m3m4m', f:'<a href=""></a>Mary (m)<div style="color:red; font-style:italic">CJfK</div>'},
'lvl2m3m', ''],
          [{v:'lvl2m3m4s', f:'<a href=""></a>Theodore (s)<div style="color:red; font-style:italic">CJfK</div>'},
'lvl2m3m', ''],
          [{v:'lvl2m3s4m', f:'<a href=""></a>Margarete (m)<div style="color:red; font-style:italic">Fancy
Seats</div>'}, 'lvl2m3s', ''],
          [{v:'lvl2m3s4s', f:'<a href=""></a>Doug (s)<div style="color:red; font-style:italic">Rolling
Hills</div>'}, 'lvl2m3s', ''],
      [{v:'lvl2s3m4m', f:'<a href=""></a>Rose (m)<div style="color:red; font-style:italic">CJfK</div>'},
'lvl2s3m', ''],
          [{v:'lvl2s3m4s', f:'<a href=""></a>Thunder (s)<div style="color:red; font-style:italic">CJfK</div>'},
'lvl2s3m', ''],
          [{v:'lvl2s3s4m', f:'<a href=""></a>Peaches (m)<div style="color:red; font-style:italic">Fancy
Seats</div>'}, 'lvl2s3s', ''],
          [{v:'lvl2s3s4s', f:'<a href=""></a>Rocky (s)<div style="color:red; font-style:italic">Rolling
Hills</div>'}, 'lvl2s3s', '']

Original issue reported on code.google.com by AllinghamD on 2011-05-18 04:49:40

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

an alternative http://www.headjump.de/article/arrows-and-boxes

Original issue reported on code.google.com by seimour.birkoff on 2011-05-18 06:03:52

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

A controllable orgchart like orgchart.png is exactly what I need to

Original issue reported on code.google.com by david@scottfamily.co.uk on 2011-05-18 16:31:23

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

Need to display Org Charts vertically too.

Original issue reported on code.google.com by bondario on 2011-08-19 11:29:08

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

The ability to display the root at left with child nodes fanning out to right would
be *extremely* useful!

Original issue reported on code.google.com by steve.boxersoft on 2011-08-23 12:48:18

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

+1 for wanting control of the orientation of children elements.  Something like a "child_orientation"
property which could be "vertical" or "horizontal" should fix most, if not all, of
the mentioned problems.

Original issue reported on code.google.com by dylan.anderson on 2011-11-03 17:35:10

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

Would love to see an option for child orientation as well. Horizontal orientation is
pretty useless when you have dozens of nodes on level 3. 

Original issue reported on code.google.com by valentin.hussong on 2011-11-11 15:28:56

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

I would suggest alternative Jquery graph plugins that support the vertical org chart
 function, there a lot out there that are way better than googles chart api. Google
just isn't interested.

Original issue reported on code.google.com by jarred363 on 2014-10-09 06:48:31

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

Wow, five years without this adjustment, Google is losing space.

Original issue reported on code.google.com by fabiowebgraphic on 2015-01-27 15:31:44

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

Solved mine issue with yEd editor

Original issue reported on code.google.com by vaclavblazej1 on 2015-01-27 15:49:54

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

This is also a challenge for us with a large organization.

Original issue reported on code.google.com by erpconsultingdotcom on 2015-04-27 15:09:01

@orwant
Copy link
Collaborator Author

orwant commented May 9, 2015

This is also a challenge for us with a large organization.

Original issue reported on code.google.com by erpconsultingdotcom on 2015-04-27 15:09:02

@samuvk
Copy link

samuvk commented Oct 2, 2015

I would like to know more about how making the chart posted in one of the comments and where can I see more info on j.saterf and how to make this possible?

Thanks

image

@MiroslawSlanda
Copy link

image

  google.charts.load('current', {packages:["orgchart"]});
  google.charts.setOnLoadCallback(drawChart);

  function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Name');
    data.addColumn('string', 'Manager');
    data.addColumn('string', 'ToolTip');

    // For each orgchart box, provide the name, manager, and tooltip to show.
    data.addRows([
      [{v:'U.1', f:'Oliver'},'', ''],
      [{v:'U.2', f:'Jack'},'U.1', ''],
      [{v:'U.3', f:'Noah'}, 'U.2', ''],
      [{v:'G.1', f:'<div data-group="G.1"></div>'}, 'U.2', ''],
      [{v:'U.5', f:'Jacob'}, 'U.3', ''],
      [{v:'U.6', f:'Charlie'}, 'U.1', '']
    ]);

    var nodes = [
            [{v:'U.7', f:'<div>Harry</div>'}, 'G.1', ''],
        [{v:'U.8', f:'<div>Joshua</div>'}, 'G.1', ''],
        [{v:'U.9', f:'<div>James</div>'}, 'G.1', ''],
        [{v:'U.10', f:'<div>Ethan</div>'}, 'G.1', '']
      ];

    var chart = new google.visualization.OrgChart(document.getElementById('chart_div'));
    chart.draw(data, {allowHtml:true});

    $("div[data-group]").each(function ()
        {
            var parent = $(this).parent();
    $(this).css('position', 'absolute');
    $(this).css('padding-top', '0');
            parent.removeClass("google-visualization-orgchart-node");
            parent.removeClass("google-visualization-orgchart-node-medium");
    parent.css('vertical-align', 'top');
            parent.css('min-width', '120px');
            parent.css('vertical-align', 'top');
    parent.css('padding-top', '0');

    var group = $(this).data('group');
            if(group !== undefined) 
            {
      for(var i=0; i < nodes.length; i++)
                {
        var node = nodes[i];
        if(node[1] === group) 
        {
            $(this).append(node[0].f); 
        }
                }
      $('div', this).addClass("google-visualization-orgchart-node");
      $('div', this).addClass("google-visualization-orgchart-node-medium");
      $('div', this).css('margin-bottom','5px');
            $('div', this).css('width', '100px');
            }
        });


  }

@MiroslawSlanda
Copy link

This is example: http://plnkr.co/edit/bjKmAf1kGdAv3VcKJb8h

@lalli-oni
Copy link

Very interested in this enhancement. Great tool, just needs a bit more control options.

@jmrichardson
Copy link

I would love to see this enhancement.

@haarabi
Copy link

haarabi commented Mar 5, 2017

Can we receive an update on this long running request?

@rohithkd
Copy link

With a bit more control for vertical display, if this enhancement is made, org chart will become great.

@michaelkah
Copy link

+1 from me

1 similar comment
@sheepworrier
Copy link

+1 from me

@FrostTheFox
Copy link

FrostTheFox commented Nov 4, 2018

+1, Please add this enhancement, org charts for organizations with many high level leads are not practical in the horizontal form.

@georgeslanglois
Copy link

+1 from me too

@ChaoTingChen
Copy link

+1 from me

@jankibhatt17
Copy link

i have 238 nodes and i face same problem, please suggest if anyone found solution

@snowshoes
Copy link

+1 after 6 years...

@ghost
Copy link

ghost commented Jan 27, 2021

+1

1 similar comment
@Disconn
Copy link

Disconn commented Mar 23, 2021

+1

@fiore42
Copy link

fiore42 commented Apr 7, 2021

+1
Not sure how the current org chart can be used for real organisations

@milanbog92
Copy link

+1

@venkatsamuthiram
Copy link

I am using Google Org chat my project,
Yes, Verical Display of leaves have issue, I have 500+ Node I am also facing same problem of org chat broken,

 return [
        {
              v: `Linked Under ${row.code}`,
              f: `Linked Under ${row.code}<div style="color:blue; font-style:italic">${row.details}</div>`,
       },
       `${row.code}`,
       'Account Details',
 ]

image
image

@dotBits
Copy link

dotBits commented Sep 9, 2021

+1.000

@AlexandradelLago
Copy link

+1000

@OlegGasul
Copy link

+100500

@guillaume52
Copy link

+1000

1 similar comment
@Tommy-flex365
Copy link

+1000

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests