将PHP结果集传递给Highchart中的JavaScript数组?

时间:2013-09-29 08:02:19

标签: javascript php cakephp highcharts cakephp-2.0

我需要通过将值从PHP传递到JavaScript来绘制条形图

try { 
$usr = 'MON_DW';
$pswd = '4v$view'; 
$dbConnStr = 'localhost';  
$dbConn = null;
$err = null;
$dbConn = oci_connect($usr,$pswd,$dbConnStr);
$err = oci_error();
$strSQL = "SELECT /*+parallel(B,4)*/ PERCENT_USED FROM (SELECT A.TABLESPACE_NAME,
 ROUND(((A.BYTES-B.BYTES)/A.BYTES)*100,2) PERCENT_USED
FROM
  (SELECT TABLESPACE_NAME,
    SUM(BYTES) BYTES
  FROM DBA_DATA_FILES
  GROUP BY TABLESPACE_NAME
  ) A,
  (SELECT TABLESPACE_NAME,
    SUM(BYTES) BYTES ,
    MAX(BYTES) LARGEST
  FROM DBA_FREE_SPACE
  GROUP BY TABLESPACE_NAME
  ) B
WHERE A.TABLESPACE_NAME=B.TABLESPACE_NAME AND ROWNUM< 5
ORDER BY PERCENT_USED DESC)";
$stmt = oci_parse($dbConn,$strSQL);
if ( ! oci_execute($stmt) ){
$err = oci_error($stmt);
trigger_error('Query failed: ' . $err['message'], E_USER_ERROR);
};

$rslt = oci_fetch_array($stmt,OCI_BOTH)      ;
?>
<script>

>  var pausecontent = new Array();

    <?php foreach($rslt as $key => $val){ ?>
        pausecontent.push('<?php echo $val; ?>');    <?php echo $val; } ?>

$(function () {
        $('#container').highcharts({
            chart: {
                type: 'column',
                margin: [ 50, 50, 100, 80]
            },
            title: {
                text: 'World\'s largest cities per 2008'
            },
            xAxis: {
                categories: [
                    'Tokyo',
                    'Jakarta',
                    'New York',
                    'Seoul',
                                                      ],
                labels: {
                    rotation: -45,
                    align: 'right',
                    style: {
                        fontSize: '13px',
                        fontFamily: 'Verdana, sans-serif'
                    }
                }
            },
            yAxis: {
                min: 0,
                title: {
                    text: 'Population (millions)'
                }
            },
            legend: {
                enabled: false
            },
            tooltip: {
                pointFormat: 'Tablespaces in EDW : <b>{point.y:.1f} millions</b>',
            },
            series: [{
                name: 'Tablespaces',
                data: pausecontent,
                dataLabels: {
                    enabled: true,
                    rotation: -90,
                    color: '#FF00F',
                    align: 'right',
                    x: 4,
                    y: 10,
                    style: {
                        fontSize: '13px',
                        fontFamily: 'Verdana, sans-serif',
                        textShadow: '0 0 3px black'
                    }
                }
            }]
        });
    });

</script>

<?php     
}


 catch(Exception $exception){
   echo "Exception Details in Accessing find_largeobject details".$exception->getMessage();
        }

3 个答案:

答案 0 :(得分:0)

你可以将php数组设置为javascript的json对象,如下所示:

var json = eval(<?php echo json_encode($rslt)?>);

答案 1 :(得分:0)

尝试这样的事情。

<?php
$rslt = array( 
    'Date.UTC(2013, 7, 01)' => 8,
    'Date.UTC(2013, 7, 02)' => 7,
    'Date.UTC(2013, 7, 03)' => 10,
    'Date.UTC(2013, 7, 04)' => 2,       
   );

?>

<script>
//<![CDATA[
var pausecontent = [];

<?php foreach ($rslt as $key => $val) { ?>

pausecontent.push([ <?php echo "'$key', '$val'"; ?>]);

<?php } ?>
//]]>
</script>

之后将javascript变量放在图表系列上。

<script>
.
.

 series: [{
            name: 'Tablespaces',
            data: pausecontent,

        }]
 .
 .
</script>

答案 2 :(得分:0)

请查看如何解析数据库http://www.highcharts.com/docs/working-with-data/preprocessing-data-from-a-database中的数据,但显然您也可以使用json_encode($ array)并通过javascript中的getJSON函数获取数据。