Canvas js如何在Yii2中将数据从数据库推送到图表

Question

我正在研究yii2。我已经安装了canvas js库，试图运行示例图表示例。现在，我想从数据库中推送数据。我可以从数据库中查看单个数据，但是我想在数据库更新时放入所有数据，即我有一个按钮，然后单击该按钮，在此期间我的表已更新，我也想更新图表以显示更新的值。

注意：图表应显示趋势

下面是我要从中将数据插入到表中的控制器代码

public function actionData()
{
    try {
        $cust_met_data = Yii::$app->db->createCommand(
            "SELECT m.`meter_id` , m.`msn` , 
                  m.`cust_id` , m.`device_id` FROM `mdc_meter_cust_rel` m ")->queryAll();
    } catch (Exception $e) {
    }

    $slave_id = $cust_met_data[0]['device_id'];
    $address = 0;
    $count = 14;
    $msn = $cust_met_data[0]['msn'];
    $cust_id = $cust_met_data[0]['cust_id'];

    // my base URL
    $api_url = 'https://localhost:44337/api/rtu/GetData/' . $slave_id . '/' . $address . '/' . $count;


    $curl = curl_init($api_url);

    curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($curl, CURLOPT_TIMEOUT, 1000);
    curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, 0);
    curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);

    $curl_response = curl_exec($curl);

    $json = json_decode($curl_response);

    if($json->{0} == '06')
    {
        Yii::$app->getSession()->setFlash('error', '
 <div class="alert alert-error alert-dismissable">
 <button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button>
 <strong>No Communication! </strong> Meter Data is Unavailable.</div>');

        return $this->redirect(['index']);
    }
    else
    {
        $vol_1 = $json->{0};
        $vol_2 = $json->{1};
        $vol_3 = $json->{2};
        $curr_1 = $json->{3};
        $curr_2 = $json->{4};
        $curr_3 = $json->{5};
        $kwh = $json->{6};

        $model = new MdcmetersData();
        $model->load(Yii::$app->request->post());
        $model->data_date_time = date('Y-m-d H:i:s');
        $model->device_id = $slave_id;
        $model->msn = $msn;
        $model->cust_id = $cust_id;
        $model->voltage_p1 = $vol_1;
        $model->voltage_p2 = $vol_2;
        $model->voltage_p3 = $vol_3;
        $model->current_p1 = $curr_1;
        $model->current_p2 = $curr_2;
        $model->current_p3 = $curr_3;
        $model->kwh = $kwh;

        if($model->save())
        {
            return $this->redirect(['index', 'model' => $model]);
        }
        else
        {
            return $this->redirect(['index']);

        }

    }




}

Index.php

<script type="text/javascript" src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<?PHP
  $model = $dataProvider->getModels()[0];
  $model['data_date_time'];

  $dataPoints1 = array(
  array("label"=> $model['data_date_time'], "y"=> $model['kwh']),

  );

 ?>
<div id="chartContainer1" style="width: 100%; height: 300px;display: inline-block;"></div>
<p>
    <?= Html::a('Get Meter Data', ['data'], ['class' => 'btn btn-success']) ?>
</p>



<script>
window.onload = function () {
 var chart = new CanvasJS.Chart("chartContainer1", {
    animationEnabled: true,
    theme: "light2",
    title:{
        text: "kWh of Meter"
    },
    legend:{
        cursor: "pointer",
        verticalAlign: "center",
        horizontalAlign: "right",
        itemclick: toggleDataSeries
    },
    data: [{
        type: "column",
        name: "kwh",
        indexLabel: "{y}",

        showInLegend: true,
        dataPoints: <?php echo json_encode($dataPoints1, JSON_NUMERIC_CHECK); ?>
    }
    ]
});
chart.render();

function toggleDataSeries(e){
    e.dataSeries.visible = !(typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible);
    chart.render();
}
};

图表输出

这是显示的单个值，但实际上我有多个值。

我已经搜索了解决方案，但发现的只是传统的数据推送方式。即在PHP中，我必须运行查询，然后对此执行操作。这里显示一个示例PHP Chart Data from Database

我该怎么办？任何帮助将不胜感激

Answer 1

因为您正在从$dataProvider获得第一条记录，所以要填充>

$model = $dataProvider->getModels()[0];
应该是

$model = $dataProvider->getModels();
除此之外，我将使事情保持简单，并通过在模型中创建一个单独的静态函数来提取数据，然后从控制器中调用它，并将数据传递到视图上以显示图表。