- Data Format
- Cogic Organizational Charts
- Cogic Organizational Chart Image
- Cogic Organizational Chart Examples
- Cogic Organizational Chart 2017
Ecclesiastical polity is the operational and governance structure of a church or of a Christian denomination.It also denotes the ministerial structure of a church and the authority relationships between churches. Polity relates closely to ecclesiology, the study of doctrine and theology relating to church organization. Ecclesiastical polity is defined as both the subject of ecclesiastical. A Organizational Chart showing COGIC Education. You can edit this Organizational Chart using Creately diagramming tool and include in your report/presentation/website.
Cogic Organizational Charts
Overview
Org charts are diagrams of a hierarchy of nodes, commonly used to portray superior/subordinate relationships in an organization. A family tree is a type of org chart.
Example
Loading
The package name is
'orgchart'
. The visualization's class name is
google.visualization.OrgChart
.Data Format
A table with three string columns, where each row represents a node in the orgchart. Here are the three columns:
- Column 0 - The node ID. It should be unique among all nodes, and can include any characters, including spaces. This is shown on the node. You can specify a formatted value to show on the chart instead, but the unformatted value is still used as the ID.
- Column 1 - [optional] The ID of the parent node. This should be the unformatted value from column 0 of another row. Leave unspecified for a root node.
- Column 2 - [optional] Tool-tip text to show, when a user hovers over this node.
Each node can have zero or one parent node, and zero or more child nodes.
Custom Properties
You can assign the following custom properties to data table elements, using the
setProperty()
method of DataTable
:Cogic Organizational Chart Image
Property Name | |
---|---|
selectedStyle | Applies To: DataTable row An inline style string to assign to a specific node when selected. You must set the option allowHtml=true for this to work, and it must be set before calling draw() on the visualization. This overrides the selectionColor option for the specified node. Example: myDataTable.setRowProperty(2, 'selectedStyle', 'background-color:#00FF00'); |
style | Applies To: DataTable row An inline style string to assign to a specific node. This is overridden by the selectedStyle property. You must set the option allowHtml=true for this to work, and it must be set before calling draw() on the visualization. This overrides the color option for the specified node. Example: myDataTable.setRowProperty(3, 'style', 'border: 1px solid green'); |
Configuration Options
Name | |
---|---|
allowCollapse | Determines if double click will collapse a node. Default: false |
allowHtml | If set to true, names that includes HTML tags will be rendered as HTML. Default: false |
color | Deprecated. Use nodeClass instead. The background color of the orgchart elements. Default: '#edf7ff' |
nodeClass | A class name to assign to node elements. Apply CSS to this class name to specify colors or styles for the chart elements. Default: default class name |
selectedNodeClass | A class name to assign to selected node elements. Apply CSS to this class name to specify colors or styles for selected chart elements. Default: default class name |
selectionColor | Deprecated. Use selectedNodeClass instead. The background color of selected orgchart elements. Default: '#d6e9f8' |
size | 'small', 'medium' or 'large' Default: 'medium' |
Methods
Method | |
---|---|
collapse(row, collapsed) |
Return Type: none |
draw(data, options) | Draws the chart. |
getChildrenIndexes(row) | Returns an array with the indexes of the children of the given node. Return Type Array.<number> |
getCollapsedNodes | Returns an array with the list of the collapsed node's indexes. |
getSelection() | Standard getSelection() implementation. Selection elements are all row elements. Can return more than one selected row. Return Type: Array of selection elements |
setSelection(selection) | Standard setSelection() implementation. Treats every selection entry as a row selection. Supports selection of mutiple rows. |
Cogic Organizational Chart Examples
Events
Name | |
---|---|
collapse | Event triggered when allowCollapse is set to true and the user double clicks on a node with children. collapsed - A boolean indicating whether this is a 'collapse' or 'expand' event. row - The zero-based index of the row in the data table, corresponding to the node being clicked. |
onmouseover | Triggered when the user hovers over a specific row. row - The zero-based index of the row in the data table, corresponding to the node being moused over. |
onmouseout | Triggered when the user hovers out of a row. row - The zero-based index of the row in the data table, corresponding to the node being moused out from. |
select | Standard select event None |
ready | The chart is ready for external method calls. If you want to interact with the chart, and call methods after you draw it, you should set up a listener for this event before you call the draw method, and call the methods only after the event is fired. None |
Data Policy
Cogic Organizational Chart 2017
All code and data are processed and rendered in the browser. No data is sent to any server.