<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<html>
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {packages:['wordtree']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var nodeListData = new google.visualization.DataTable();
nodeListData.addColumn('number', 'ID');
nodeListData.addColumn('string', 'childLabel');
nodeListData.addColumn('number', 'parent');
nodeListData.addColumn('number', 'size');
nodeListData.addColumn({ type: 'string', role: 'style' });
//--- Critical row Uncomment to get working
//nodeListData.addRow([ 0,'PH', -1, 6, 'black']);
nodeListData.addRow([100000000, 'Electrical', 0, 5, 'black']);
nodeListData.addRow( [101000000, 'Lighting', 100000000, 4, 'black']);
nodeListData.addRow( [101010000, 'Lamps and Ballasts', 101000000, 3, 'black']);
nodeListData.addRow( [101010100, 'Lamps', 101010000, 2, 'green']);
nodeListData.addRow( [101010101, 'Halogen lamps', 101010100, 1, '#cba']);
nodeListData.addRow( [101010102, 'Medical lamps', 101010100, 1, '#cba']);
nodeListData.addRow( [101010103, 'Solar lamps', 101010100, 1, '#cba']);
nodeListData.addRow( [101010104, 'Fluorescent lamps', 101010100, 1, '#cba']);
nodeListData.addRow( [101010105, 'Stage or studio lamps', 101010100, 1, '#cba']);
nodeListData.addRow( [101010106, 'Incandescent lamps', 101010100, 1, '#cba']);
nodeListData.addRow( [101010107, 'Infrared lamps', 101010100, 1, '#cba']);
nodeListData.addRow( [101010108, 'Metal halide lamps HID', 101010100, 1, '#cba']);
nodeListData.addRow( [101010109, 'Mercury vapor lamps HID', 101010100, 1, '#cba']);
nodeListData.addRow( [101010110, 'Ultraviolet UV lamps', 101010100, 1, '#cba']);
nodeListData.addRow( [101010111, 'High pressure sodium lamps HID', 101010100, 1, '#cba']);
nodeListData.addRow( [101010112, 'Neon lamps', 101010100, 1, '#cba']);
nodeListData.addRow( [101010113, 'Compact fluorescent CFL lamps', 101010100, 1, '#cba']);
nodeListData.addRow( [101010114, 'Induction lamps', 101010100, 1, '#cba']);
nodeListData.addRow( [101010115, 'Low pressure sodium lamps HID', 101010100, 1, '#cba']);
nodeListData.addRow( [101010116, 'Miniature lamps', 101010100, 1, '#cba']);
nodeListData.addRow( [101010117, 'Sealed beam lamp', 101010100, 1, '#cba']);
nodeListData.addRow( [101010118, 'LED Lamp', 101010100, 1, '#cba']);
nodeListData.addRow( [101010119, 'SPECIALTY LAMPS', 101010100, 1, '#cba']);
nodeListData.addRow( [101010120, 'Miscellaneous lamps', 101010100, 1, '#cba']);
nodeListData.addRow( [101010200, 'Ballasts', 101010000, 2, 'green']);
nodeListData.addRow( [101010201, 'FLUORESCENT BALLASTS', 101010200, 1, '#cba']);
nodeListData.addRow( [101010202, 'ELECTRONIC FLUORESCENT BALLASTS', 101010200, 1, '#cba']);
nodeListData.addRow( [101010203, 'MAGNETIC FLUORESCENT BALLASTS', 101010200, 1, '#cba']);
nodeListData.addRow( [101010204, 'DIMMING FLUORESCENT BALLASTS', 101010200, 1, '#cba']);
nodeListData.addRow( [101010205, 'HIGH INTENSITY DISCHARGE BALLASTS', 101010200, 1, '#cba']);
nodeListData.addRow( [101010206, 'EMERGENCY BALLASTS', 101010200, 1, '#cba']);
var options = {
maxFontSize: 14,
wordtree: {
format: 'explicit',
type: 'suffix'
}
};
var chart = new google.visualization.WordTree(
document.getElementById('wordtree_basic'));
chart.draw(nodeListData, options);
}
</script>
</head>
<body>
<div id="wordtree_basic" style="width: 900px; height: 500px;"></div>
</body>
</html>