My project produces an error on rendering and wont produce the graph. The current scripts have been loaded but the renderer is the problem. Here is my code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>International Marketing Group</title>
<!-- Bootstrap Core CSS -->
<link href="<?php echo base_url();?>assets/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="<?php echo base_url();?>assets/css/img.css" rel="stylesheet">
<!-- Custom Fonts -->
<link href="<?php echo base_url();?>assets/font-awesome-4.1.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="UserHome.php"><img style="max-width:100px; margin-top: -7px;" src="<?php echo base_url();?>assets/images/logo_2.png" width="100px" height="30px" /></a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-left">
<li >
<a href="<?php echo base_url();?>index.php/img_controller_user/UserHome" class="glyphicon glyphicon-home" > Home</a>
</li>
<li >
<a href="<?php echo base_url();?>index.php/img_controller_user/UserAbout" class="glyphicon glyphicon-globe"> About</a>
</li>
<li>
<a href="<?php echo base_url();?>index.php/img_controller_user/Userservices" class= "glyphicon glyphicon-briefcase" > Services</a>
</li>
<li >
<a href="<?php echo base_url();?>index.php/img_controller_user/UserContact" class="glyphicon glyphicon-phone"> Contact</a>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Options <b class="caret"></b></a>
<ul class="dropdown-menu">
<li>
<a href="<?php echo base_url();?>index.php/img_controller_user/userprofile"><i class="glyphicon glyphicon-edit "></i>
My Profile
</a>
</li>
<li>
<a href="<?php echo base_url();?>index.php/img_controller_network/user_network"><i class="glyphicon glyphicon-edit "></i>
My Network
</a>
</li>
<li>
<a href="<?php echo base_url();?>index.php/img_controller_verification/user_logout" ><i class="glyphicon glyphicon-off"></i>
Logout
</a>
</li>
</ul>
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
<!-- Page Content -->
<div class="container">
<!-- Page Heading/Breadcrumbs -->
<div class="row">
<div class="col-lg-12">
<h1 class="page-header"> My Network
<small>International Marketing Group</small>
</h1>
<ol class="breadcrumb">
<li><a href="UserHome.php">Home</a>
</li>
<li class="active">title</li>
</ol>
</div>
</div>
<!-- /.row -->
<!-- Intro Content -->
Uplink
<table class="table table-hover table-bordered">
<tr>
<td><strong>Recruiter</strong></td>
<td><strong>Marketing Director </strong></td>
<td><strong>Custodian</strong></td>
<td><strong>Referror</strong></td>
<td><strong>Trainor</strong></td>
</tr>
<?php if(is_array($link) && count($link) ) {
foreach($link as $loop){
?>
<tr>
<td><?php echo "Name:".$loop->hierarchial_recruiter."<br>";echo "Agent Code:".$loop->hierarchial_recruiter_code; ?></td>
<td><?php echo "Name:".$loop->hierarchial_marketing_director."<br>"; echo "Agent Code:".$loop->hierarchial_marketing_director_code;?></td>
<td><?php echo "Name:".$loop->hierarchial_custodian."<br>"; echo "Agent Code:".$loop->hierarchial_custodian_code;?></td>
<td><?php echo "Name:".$loop->hierarchial_referror."<br>"; echo "Agent Code:".$loop->hierarchial_referror_code;?></td>
<td><?php echo "Name:".$loop->hierarchial_trainor."<br>"; echo "Agent Code:".$loop->hierarchial_trainor_code;?></td>
</tr>
<?php }
}?>
</table>
<div class="panel panel-default">
<div class="panel-heading">Promotion System</div>
<div class="panel-body">
<!-- IMPORTANT LINES -->
<h2>Position:
<!-- Position call position.js -->
<label ><?php echo $position[0]->position;?></label>
</h2>
Agent Code:<label ><?php echo $position[0]->agent_code;?></label><br>
Join Date:<label ><?php echo $position[0]->receipt_no;?></label><br>
Total Member <label ><?php echo $total_downlink;?></label><br>
<!-- IMPORTANT LINES -->
<canvas id="viewport" width="800" height="600"></canvas>
<!-- IMPORTANT LINES -->
</div>
</div>
Team Members
<ul class="nav nav-tabs" role="tablist" id="myTab">
<li class="active"><a href="#marketing" role="tab" data-toggle="tab">Assistant Marketing Directors</a></li>
<li><a href="#fieldleader" role="tab" data-toggle="tab">Field Leader</a></li>
<li><a href="#recruiter" role="tab" data-toggle="tab">Recruits</a></li>
<li><a href="#trainor" role="tab" data-toggle="tab">Trainees</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="marketing">
<table class="table table-hover table-bordered">
<tr>
<td class="text-center">
<strong></strong></td>
<td><strong>Name</strong></td>
<td><strong>Agent Code</strong></td>
<td><strong>Position</strong></td>
</tr>
<?php if(is_array($amd) && count($amd) ) {
foreach($amd as $loop){
?>
<tr>
<td></td>
<td><?php echo $loop->first_name." ".$loop->middle_name." ".$loop->last_name;?></td>
<td><?php echo $loop->agent_code;?></td>
<td><?php echo $loop->position;?></td>
</tr>
<?php }
} else
{
echo "<tr><td colspan='4'>No information available</td></tr>";
}?>
</table>
</div>
<div class="tab-pane" id="recruiter">
<table class="table table-hover table-bordered">
<tr>
<td class="text-center">
<strong></strong></td>
<td><strong>Agent Code</strong></td>
<td><strong>Name</strong></td>
<td><strong>Position</strong></td>
<td><strong>Join Date</strong></td>
</tr>
<?php if(is_array($recruiter) && count($recruiter) ) {
foreach($recruiter as $loop){
?>
<tr>
<td></td>
<td><?php echo $loop->agent_code;?></td>
<td><?php echo $loop->first_name." ".$loop->middle_name." ".$loop->last_name;?></td>
<td><?php echo $loop->position;?></td>
<td><?php echo $loop->receipt_no;?></td>
</tr>
<?php }
} else
{
echo "<tr><td colspan='3'>No information available</td></tr>";
}?>
</table>
</div>
<div class="tab-pane" id="fieldleader">
<table class="table table-hover table-bordered">
<tr>
<td class="text-center">
<strong></strong></td>
<td><strong>Name</strong></td>
<td><strong>Agent Code</strong></td>
<td><strong>Position</strong></td>
</tr>
<?php if(is_array($fieldleader) && count($fieldleader)) {
foreach($fieldleader as $loop){
?>
<tr>
<td></td>
<td><?php echo $loop->first_name." ".$loop->middle_name." ".$loop->last_name;?></td>
<td><?php echo $loop->agent_code;?></td>
<td><?php echo $loop->position;?></td>
</tr>
<?php }
} else
{
echo "<tr><td colspan='4'>No information available</td></tr>";
}?>
</table>
</div>
<div class="tab-pane" id="trainor">
<table class="table table-hover table-bordered">
<tr>
<td class="text-center">
<strong></strong></td>
<td><strong>Agent Code</strong></td>
<td><strong>Name</strong></td>
<td><strong>Position</strong></td>
</tr>
<?php if(is_array($trainor) && count($trainor) ) {
foreach($trainor as $loop){
?>
<tr>
<td> <a href="<?php echo base_url();?>index.php/img_controller_network/user_promote_ta/<?php echo $loop->agent_code;?>"><input type="button" class="btn btn-warning" value="promote"></a></td>
<td><?php echo $loop->agent_code;?></td>
<td><?php echo $loop->first_name." ".$loop->middle_name." ".$loop->last_name;?></td>
<td><?php echo $loop->position;?></td>
</tr>
<?php }
} else
{
echo "<tr><td colspan='4'>No information available</td></tr>";
}?>
</table>
</div>
</div>
<!-- /.row -->
<hr>
<!-- Footer -->
<footer>
<div class="row">
<div class="col-lg-12">
<p>Copyright © International Marketing Group 2014</p>
</div>
</div>
</footer>
</div>
<!-- /.container -->
<!-- jQuery Version 1.11.0 -->
<script language="javascript" type="text/javascript" src="<?php echo base_url();?>assets/js/jquery-1.11.1.min.js"></script>
<script language="javascript" type="text/javascript" src="<?php echo base_url();?>assets/js/arbor.js"></script>
<script language="javascript" type="text/javascript" src="<?php echo base_url();?>assets/js/arbor-tween.js"></script>
<script language="javascript" type="text/javascript" src="<?php echo base_url();?>assets/js/main.js"></script>
<script language="javascript" type="text/javascript" src="<?php echo base_url();?>assets/js/system.js"></script>
<script language="javascript" type="text/javascript" src="<?php echo base_url();?>assets/js/graphics.js"></script>
<script language="javascript" type="text/javascript" src="<?php echo base_url();?>assets/js/renderer.js"></script>
<script language="javascript" type="text/javascript" src="<?php echo base_url();?>assets/js/parseur.js"></script>
<!-- Bootstrap Core JavaScript -->
<script language="javascript" type="text/javascript" src="<?php echo base_url();?>assets/js/bootstrap.min.js"></script>
<script language="javascript" type="text/javascript" src="<?php echo base_url();?>assets/js/halfviz.js"></script>
</body>
</html>