mysql - 如何从 mysql 数据库中提取数据并使用 yii-framework 将它们绘制在 highcharts 中

Question

mysql数据库有三个元素，id，datetime和data。

请帮我检查一下我的代码有什么问题。我想从 mysql 数据库中提取最新 15 条数据并将它们绘制在 highcharts 中。但是，我只能在图表上显示最新的单个数据，而我的 x 轴未显示日期时间数据。

我尝试了网上提供的代码 http://www.highcharts.com/demo/line-basic然而，它仅适用于预定义值，不适用于 mysql 数据库值。

我尝试编辑它，下面是我的代码。

<script scr = "//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src='http://code.highcharts.com/highcharts.js' type='text/javascript'> </script>       
<script src='http://code.highcharts.com/modules/exporting.js' type='text/javascript'> </script>    

</head>
<?php
$rowsA = array();
$rowsA[]= Yii::app()->db->createCommand("Select data from customername order by id desc limit 15")->queryScalar();
$datedata[] = Yii::app()->db->createCommand("Select date from customername order by id desc limit 15")->queryScalar();
>
<script type = "text/javascript">
$(function () {
    $('#container').highcharts({
        chart: {
        type: 'line',
        marginRight: 130,
        marginBottom: 25
    },
        title: {
            text: 'BABY BODY TEMPERATURE',
            x: -20 
        },

        xAxis: {

       // type: 'datetime',
       // dateTimeLabelFormats:{
        //   month: '%e, %b',
          //  year: '%b'}//can work
     //  categories: ['<php echo join($datedata, "','") ?>'],
     // categories: [<php  echo join($datedata, "','"); ?>],
        //  },

        },
        yAxis: {
            title: {
            text: 'Temperature (°C)'
            },
        plotLines: [{
            value: 0,
            width: 1,
            color: '#808080'
        }]
    },
    tooltip: {
        valueSuffix: '°C',

    },
    legend: {
        layout: 'vertical',
        align: 'right',
        verticalAlign: 'top',
        x: -10,
        y: 100,
        borderWidth: 0
    },
    series: [{
        name: 'Baby Temperature',
        data: [<?php echo join($rowsA, "','");?>]


        //predefined data is working fine.
       // data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
    }]
 });
});

</script>

我在想，当我能够提取mysql数据并将其绘制在highcharts中时，x轴的数字形式为1,2,3,....然后我将尝试在x轴上显示日期时间。然而，我被困在了第一阶段；只能显示单条最新数据，而我想要的是15条数据。

如果有人能帮助我，我将不胜感激。非常感谢。

Answer 1

切勿在 View 文件中查询。在模型中创建 getter 或在 Controller 中进行查询并将数据传递给 View 。 对于 x 标签形式数组的日期。例如我形成过去 30 天的数组:

        $output = array();
        for($i = 30; $i >=0 ; $i--)
        $output[] = date("Y-m-d", strtotime('-'. $i .' days'));
        return $output;

这将是我们的 x 标签。然后在模型或 Controller 中获取数据:

$criteria=new CDbCriteria;
        $criteria->limit=15;
        $criteria->order='id DESC';
$data=new CActiveDataProvider(, array('customername'
            'criteria'=>$criteria,
        ));

现在根据您的数据形成系列数组。 Yii-highcharts 是一个很棒的扩展，可以提供很多帮助。 然后将其推送到您的绘图中:

'xAxis'=>array(
                'categories'=> $xlabels, 
                'gridLineWidth' => 1,
                'gridLineDashStyle' => 'LongDash',
                'tickmarkPlacement' => 'on',
                'tickInterval' => 6
                    ),

'series'=> array(

            array('name'=> 'Failed records',
                'data'=> $data_array,
                'color' => '#ff0000',
                'shadow'=> false
            ),

在 javascript 中使用 yii-highcharts 或 echo php 变量:

var xlabels="<?php echo $xlabels?>";

然后在你的图中使用它:

xAxis:{
                categories: xlabels, 
                gridLineWidth : 1,
                gridLineDashStyle : 'LongDash',
                tickmarkPlacement : 'on',
                tickInterval : 6
                    },