Calcetines Extreme

Calcetines Extreme
Take care of you using the best socks

Saturday, May 23, 2015

Adding #Charts to a website using javascrip with DataBase connection

Problem:   
You have some data in your DataBase that you would like to explode with Charts to offer Analytics solution to your visitors.

Solution:    
One simple way is to use highcharts, a company that has a collection of utilities to paint Charts using a simple script and of course with data base connecction and much more.

Sample:
$dbcon = mysql_connect("localhost", "bartolo", "******");
mysql_select_db("DATABASE", $dbcon);
$result = mysql_query("SELECT * FROM table");
while ($row = mysql_fetch_array($result)) {
   $data[] = "['".$row['name']."',".$row['tot']."]";
}
?>

...
$(function () {
    $('#container').highcharts({
        chart: {
            type: 'pie',
            options3d: { enabled: true, alpha: 45, beta: 0 }
        },
        title: { text: 'Chosse the best Broker' },
        tooltip: {
            pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
        },
        plotOptions: {
            pie: {  allowPointSelect: true, cursor: 'pointer', depth: 35,
                dataLabels: { enabled: true, format: '{point.name}' }}
        },
        series: [{
            type: 'pie',             name: 'Browser share',
            data: [  <?php echo join($data, ','); ?> ]
        }]
    });
});
  </script>

...
Source: