Css Bar chart changable according to database output

<?php include_once(‘checksession.php’); ?>
<span style=”color:white;float:right;”><a href=”logout.php”>Logout</a></span>
<?php
$userid = $_SESSION[‘id’];
$conn=mysql_connect(‘netinnovatus.com.mysql’,’netinnovatus_co’,’v4EYFZYC’);
mysql_select_db(‘netinnovatus_co’,$conn);
$result=mysql_query(“select * from ea_results where USER_ID='”.$userid.”‘”);
$res=mysql_fetch_assoc($result);

?>
<style>
.result
{
color:green;
}
.bargraph ul
{
list-style-type:none !important;
margin: 0px !important;
}
.label li {
height:25px !important;
font-size:9px !important;
}
.bargraph
{
width:55% !important;
}
</style>
<link href=’http://pics.cssbakery.com/pics/css/verticalbargraph.css&#8217; rel=’stylesheet’ type=’text/css’/>

<h1>
You scored:
</h1>
<div class=”bargraph” style= “width: 365px;”>
<ul class=”bars”>
<li class=”bar1″ style=”height: <?php echo $a=($res[‘magical’] *2) +1 ;?>%;”><?php echo $res[‘magical’] ;?></li>
<li class=”bar2″ style=”height: <?php echo $b=($res[‘logical’] *2 ) +1;?>%;”><?php echo $res[‘logical’] ;?></li>
<li class=”bar3″ style=”height: <?php echo $c=($res[‘critical’] *2)+1 ;?>%;”><?php echo $res[‘critical’] ;?></li>
<li class=”bar4″ style=”height: <?php echo $d=($res[‘agile’] *2) +1 ;?>%;”><?php echo $res[‘agile’] ;?></li>

</ul>
<ul class=”label”><li>Magical</li><li>Logical</li><li>Critical</li><li>agile</li></ul>
<ul class=”y-axis”><li>Max</li><li>30</li><li>20</li><li>10</li><li>0</li></ul>

</div>

Advertisements

One comment

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s