I've drafted an org chart but it contains a lot of white space. The lines
between the nodes are noticeably long. I'd like to shorten them but don't
know how. Also, the chart would look a bit neater if the boxes were
shorter and wider. Is there any way to manipulate the size and shape of
the boxes?
Here's a sample of my code:
<html>
<head>
<script type="text/javascript"
src="https://www.gstatic.com/charts/loader.js";></script>
<script type="text/javascript">
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:'RL', f:'RNDL'},
'', ''],
[{v:'Mgr', f:'<a href="https://"; target="_blank">NDM</a>'},
'RL', ''],
[{v:'PML', f:'<a href="https://"; target="_blank">PML</a>'},
'Mgr', ''],
[{v:'PM', f:'<a href="https:// target="_blank">PM</a>'}, 'PML',
''],
['SPM', 'PM', ''],
['<a href="https://"; target="_blank">ADM</a>', 'SPM', ''],
[{v:'FOM', f:'<a href="https://"; target="_blank">MOM</a>'},
'Mgr', ''],
[{v:'MCC', f:'<a href="https://"; target="_blank">MCC</a>'},
'FOM', ''],
[{v:'MCM', f:'<a href="https://"_blank";>MCM</a>'}, 'MCC', ''],
['<a href="https://"_blank";>FDM</a>', 'MCM', ''],
[{v:'CL', f:'<a href="https://"; target="_blank">CL</a>'},
'Mgr', ''],
[{v:'CM', f:'<a href="https://"_blank";>CM</a>'}, 'CL', ''],
[{v:'DM', f:'<a href="https://"; target="_blank">DM</a>'}, 'CM',
''],
['FM, 'DM', '']
]);
var chart = new
google.visualization.OrgChart(document.getElementById('chart_div'));
chart.draw(data, {allowHtml:true});
}
</script>
<style>
table{
border-collapse: separate !important;
}
</style>
</head>
<body>
<div id="chart_div"></div>
</body>
</html>
The <style> info was added to get rid of the blue lead lines that were
rendering in error. I've read a bit about possibly using the "chart_div"
to style the nodes? But I don't know how that would work (what it would
look like).
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to google-visualization-api+unsubscr...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit
https://groups.google.com/d/msgid/google-visualization-api/00932da9-ae39-4e32-b75d-4af89cfdc2ae%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
