GoogleChart 階層ごとのブロックの長さを個別に設定したい

解決済

質問者：DDddDDdd11221122
質問日時：2022/07/06 14:27
回答数：1件

GoogleChart 階層ごとのブロックの長さが、最も長いものにすべて統一されてしまうため
それぞれの長さで個別に設定することは可能でしょうか？
構造上、不可能な気もしますが、、、
どうかお知恵をお貸しください。よろしくお願いいたします。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="https://www.google.com/jsapi"></script>

<script>
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':'test1', 'f':'test1'},
'', 'The President'],
[{'v':'test2', 'f':'test2<div style="color:red; font-style:italic">一番長い<br>ブロックで<br>全ての列が<br>統一されてしまう</div>'},
'test1', 'VP'],
['test3', 'test1', ''],
['test4', 'test1', 'Bob Sponge'],
['test5', 'test2', '']
]);

// Create the chart.
var chart = new google.visualization.OrgChart(document.getElementById('chart_div'));
// Draw the chart, setting the allowHtml option to true for the tooltips.
chart.draw(data, {'allowHtml':true});
}

</script>
</head>
<body>


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

</html>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (1件)

ベストアンサー優先
最新から表示
回答順に表示

No.1ベストアンサー

回答者： fujillin
回答日時：2022/07/06 16:14

こんにちは

Google Chartはテーブルを利用しているようですので、難しいと思います。

自由に組み立てたいのであれば、そのようなダイアグラムに特化したライブラリを利用なさる方が宜しいかと思います。
そうすることで、前回のご質問内容も、クリアに実現できるものと思います。

https://dzone.com/articles/top-5-javascript-libr …