OrgChart Customization

[Prathibha]

Hi,

Currently I am getting a Manager and Subordinates deails in an org
chart for A USER Selected (i.e 3 layer only).

1. As per my requirement, I should be able to expand from Manager
lever to the further UP and from Subordinates level tothe further
DOWN.

2. I would like to have this expand collapse event trigger on image
click.Currently it is happening on doubleclickin each box in the org
chart.

3. I would like to highlight the User Selected.

Please let me know in case there are any suggestios on this.

Thanks and Regards,
Prathibha

[MC Get Vizzy]

On Fri, Nov 26, 2010 at 11:54 AM, Prathibha <mendon.p...@gmail.com> wrote:

Hi,

Currently I am getting a Manager and Subordinates deails in an org
chart for  A USER Selected (i.e 3 layer only).

1. As per my requirement, I should be able to expand from Manager
lever to the further  UP and from Subordinates level tothe further
DOWN.

I'm having trouble understanding what is the effect that you're trying to achieve here.  If you are trying to create a chart where a node can be visible while its parents are "hidden", the google org chart does not provide any support for that, but you can probably achieve it by redrawing the chart.  Also note that you can control which nodes are collapsed by calling the OrgChart's collapse() method.

 

2. I would like to have this expand collapse event trigger on image
click.

What do you mean by "image click"?

 

Currently it is happening on doubleclickin each box in the org
chart.

3. I would like to highlight the User Selected.

Can you use the selectedNodeClass option to set some kind of "highlited" css class for the selected node?

hope that helps,

MC Get Vizzy

 

Please let me know in case there are any suggestios on this.

Thanks and Regards,
Prathibha

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To post to this group, send email to google-visua...@googlegroups.com.
To unsubscribe from this group, send email to google-visualizati...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.

[Prathibha Mendon]

Hi,

Please Find attached the Org chart I am getting now for User XYZ.

You can see a UP ARROW and DOWN ARROW. I need to extend the chart when the user clicks on the UP ARROW also when he clicks DOWN ARROW.


--
Thanks and Regards,

Prathibha Mendon

[MC Get Vizzy]

Your example does not look very much like Google's OrgChart.  You might be able to achieve a similar kind of behavior by providing a DataTable/DataView where "Prathibha M" (for example) is the "root" of the hierarchy.  You could provide your own up arrow.  When a user clicks the up arrow, you could redraw the OrgChart with a new DataTable/DataView where Prathibha's manager is the "root", and so on.

[naven87]

It is possible ,although I think the arrows particularly down will be
more complicated since the OrgChart doesn't include that, and also
doesn't provide any external cues to the hierarchy that would help
determine which nodes require up and down arrows. What is the data
source? Will it supply only the information required for the specific
view you show (no extra higher or lower levels), if not you will have
to create logic to determine the "extra" layers and hide the rows in
the dataview so that they aren't displayed. You example does not show
any fanout but I'm assuming if there were multiple subordinates then
each would have a down arrow in your app? If so then you will need
additional customization to add the arrow to HTML of the formatted
value of the cells in the lower row. I would suggest an alternate
user interface where there isn't the unique arrows, but clicking on
the cell (or some element of the cell) causes it to become the center
of redrawn org chart.

[Prathibha]

Thanks for your replies guys.

I need to highlight a particular node when the page loads( say the
first node or top node with different background color.). Is this
possible? As of now, I can see, when you click on the node, the node
can be highlighted:

Please refer the image attached in the previous post for reference.
If possible, can someone show me with a simple example.

[naven87]

You use the getFilteredRows function on the DataTable to select the
cell(s) you want to highlight. In the example below column 6 is a
column which indicates User Role, then use the setRowProperty on those
rows highlight. I create a separate function to simplify. Example
below.
========================================================================

function set_row (rows, style) {
for (r in rows) {
data.setRowProperty(rows[r],'style',style);
}
}

var evp_rows = data.getFilteredRows([{column: 6, value: "EVP"}]);
set_row(evp_rows,"background-color:#EEF");

[MC Get Vizzy]

Can you use the OrgChart's setSelection() method?

thanks,

MC Get Vizzy

[Prathibha Mendon]

Thanks a lot.. It worked..

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To post to this group, send email to google-visua...@googlegroups.com.
To unsubscribe from this group, send email to google-visualizati...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.

--