我正在尝试在我的代码中制作orgchart,对此图表一无所知。我想制作一个像图表一样的树,并希望从mysql表中获取数据。
表是:treechart
id name treeid
1 a 1
2 aa 11
3 aaa 111
4 aaaa 1111
5 ab 12
6 aba 121
7 abb 122
8 ac 13
我的代码如下:
<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.
<?php
include get_template_directory()."/connect/connect.php";
$result = mysql_query("select * from treechart order by id asc");
$members = array();
$demo = "[\n";
while ($row = mysql_fetch_array($result))
{
$members[$row[2]] = $row[1];
}
function search_tree($searchkey)
{
return $members[$searchkey];
}
foreach($members as $key=>$member)
{
if(strlen($key)==1)
{
$demo = $demo."['".$member."','','".$member."'],\n";
$one = $member;
}
if(strlen($key)==2)
{
$demo = $demo."['".$member."','".$one."',''],\n";
}
if(substr($key,0,2)=="11")
{
if(strlen($key)==3)
{
$newkey = search_tree("11");
echo $newkey."---.";
}
}
$oldkey = strlen($key);
}
$demo = substr($demo,0,strlen($demo)-2);
$demo = $demo."]";
print_r($newdemo);
?>
data.addRows(<?php echo $demo; ?>);
// 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>
我的问题在于$ newkey我无法获得任何值,我想在$ newkey中获得11,12,13个键值。我在表格中有非常多的数据,所以如果有人有任何简短的编码想法,那么请在我的代码中帮助我。
答案 0 :(得分:0)
您必须在表格中定义父列
id | parrentId |名称
这是一个例子
var orgchart = new getOrgChart(document.getElementById("people"),{
dataSource: [
{ id: 1, parentId: null, Name: "1"},
{ id: 2, parentId: 1, Name: "2"},
{ id: 3, parentId: 1, Name: "3"}]
});
&#13;
html,
body {
margin: 0px;
padding: 0px;
height: 100%;
overflow: hidden;
}
#people {
width: 100%;
height: 100%;
}
&#13;
<link href="http://www.getorgchart.com/GetOrgChart/getorgchart/getorgchart.css" rel="stylesheet"/>
<script src="http://www.getorgchart.com/GetOrgChart/getorgchart/getorgchart.js"></script>
<div id="people"></div>
&#13;