Angular Guage with Json/ PDO (non-deprecated) Wrapper

dyncoder · December 28, 2015

Hello I wish to make this work for Angular Guage in Fusionwidget using PHP Wrapper and json format.

Can someone please look at this code and tell me where I might mod it for 2d column too angular. I looked at some this dropbox (https://www.dropbox.com/sh/mtegxolyaivxy2d/AAA39PLz0HMGALxPAAZf8FHNa?dl=0) but still need some help. Thanks

<html>
<meta http-equiv="refresh" content="10" >
   <head>
      <title>FusionCharts XT - Column 2D Chart - Data from a database</title>
    <link  rel="stylesheet" type="text/css" href="css/style.css" />

      <!-- You need to include the following JS file to render the chart.
      When you make your own charts, make sure that the path to this JS file is correct.
      Else, you will get JavaScript errors. -->

      <script src="fusioncharts/js/fusioncharts.js"></script>
  </head>

   <body>
 <?php

 try {

# MySQL with PDO_MYSQL
$mysql_host = 'host';
$mysql_database = 'factordb';
$mysql_username = 'user';
$mysql_password = 'pass';

    $conn = new PDO("mysql:host=$mysql_host; dbname=$mysql_database", $mysql_username, $mysql_password);
    // set the PDO error mode to exception
    $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
    $conn->exec("SET CHARACTER SET utf8");      // Sets encoding UTF-8

}
catch(PDOException $e) {
echo $e->getMessage();
}

         // Form the SQL query that returns the top 10 most populous countries

         // Execute the query, or else return the error message.
$stm = $conn->prepare("SELECT Factory, Result FROM mysqltable");
$stm->execute();
$results = $stm->fetchAll(PDO::FETCH_ASSOC);

 include("includes/fusioncharts.php");

$jsnarray = array();
foreach($results as $k => $v){
    $jsnarray[] = array('label' => $results[$k]['Factory'], 'value' => $results[$k]['Result']);
};

    $jsonEncodedData=json_encode($jsnarray);
    //print_r($jsonEncodedData);
    
    new FusionCharts("type of chart",
            "unique chart id",
            "width of chart",
            "height of chart",
            "div id to render the chart",
            "type of data",
            "actual data");
        $columnChart = new FusionCharts(
                "column2d",
                "ex1" ,
                "600",
                "400",
                "chart-1",
                "json",
                '{
    "chart": {
        "caption": "Customer Satisfaction Score",
        "lowerlimit": "0",
        "upperlimit": "100",
        "lowerlimitdisplay": "Bad",
        "upperlimitdisplay": "Good",
        "palette": "1",
        "numbersuffix": "%",
        "tickvaluedistance": "10",
        "showvalue": "0",
        "gaugeinnerradius": "0",
        "bgcolor": "FFFFFF",
        "pivotfillcolor": "333333",
        "pivotradius": "8",
        "pivotfillmix": "333333, 333333",
        "pivotfilltype": "radial",
        "pivotfillratio": "0,100",
        "showtickvalues": "1",
        "showborder": "0"
    },
    "colorrange": {
        "color": [
            {
                "minvalue": "0",
                "maxvalue": "45",
                "code": "e44a00"
            },
            {
                "minvalue": "45",
                "maxvalue": "75",
                "code": "f8bd19"
            },
            {
                "minvalue": "75",
                "maxvalue": "100",
                "code": "6baa01"
            }
        ]
    },
    "dials": {
        "dial": [
            {
                "value": "92",
                "rearextension": "15",
                "radius": "100",
                "bgcolor": "333333",
                "bordercolor": "333333",
                "basewidth": "8"
            },
                   "data": ' . $jsonEncodedData . '}');
        // Render the chart
        //print_r($columnChart);
        $columnChart->render();
    ?>

        <div id="chart-1"><!-- Fusion Charts will render here--></div>

       </body>

    </html>

Sign In

Angular Guage with Json/ PDO (non-deprecated) Wrapper

Recommended Posts

dyncoder

Share this post

Link to post

Share on other sites

Create an account or sign in to comment

Create an account

Sign in

Browse

Activity