如何在Yii2中正确制作高图?

时间:2017-03-19 14:55:13

标签: php sql yii yii2

我想在Yii2中制作图表,但我不知道如何正确制作图表。 这是我的表

TableGender

enter image description here

这是我在Microsoft Excel

中制作的图表

enter image description here

我在Yii2中制作了这样的图表:

HighchartController

<?php
namespace app\controllers;

use yii\web\Controller;
use app\models\Jeniskelaminreal;
use yii\helpers\Json;

class HighchartsController extends Controller
{
    public function actionIndex()
    {

        $masuk= Jeniskelaminreal::find();
        $awal = $masuk->orderBy('TahunMasuk ASC')->one()->TahunMasuk;
        $akhir = $masuk->orderBy('TahunMasuk DESC')->one()->TahunMasuk;
        // $data = $masuk->all();
        $arr_l = [];
        $arr_p = [];
        $tahun = [];


        for($i=$awal;$i<=$akhir;$i++){

                if($awal == $i){
                    $jum_l = count($masuk->where(['TahunMasuk'=>$awal,'JenisKelamin'=>'Perempuan'])->all());
                    $jum_p = count($masuk->where(['TahunMasuk'=>$awal,'JenisKelamin'=>'Laki-laki'])->all());

                }elseif($i > $awal && $i <= $akhir){
                    $jum_l = count($masuk->where(['TahunMasuk'=>$i,'JenisKelamin'=>'Perempuan'])->all());
                    $jum_p = count($masuk->where(['TahunMasuk'=>$i,'JenisKelamin'=>'Laki-laki'])->all());
                }
                array_push($arr_l,$jum_l);
                array_push($arr_p,$jum_p);
                array_push($tahun,$i);
                }               


        $data['tahun'] = json_encode($tahun);
        $data['data_p'] = json_encode($arr_p);
        $data['data_l'] = json_encode($arr_l);



        return $this->render('index',$data);
    }

    /*public function actionData()
    {
        return $this->render('data');
    }*/
}

以下是 index.php

视图
<?php
use app\assets\HighchartsAsset;

HighchartsAsset::register($this);
$this->title = 'Highcharts Test';
?>


<div class="container">
      <div class="row">
              <div class="col-md-6 col-sm-6 col-xs-12">
                <div class="x_panel">
                  <div id="my-chart" style="min-width: 310px; height: 400px; margin: 0 auto"></div>



<?php $this->registerJs("
$(function () {
    $('#my-chart').highcharts({
        title: {
            text: 'Jenis Kelamin',
            x: -20 //center
        },

        xAxis: {
            categories: $tahun
        },
        yAxis: {
            title: {
                text: 'Jumlah'
            },
            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }]
        },
        tooltip: {
            valueSuffix: ''
        },
        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'middle',
            borderWidth: 0
        },
        series: [{
            name: 'Laki-laki',
            data: $data_l
        }, {
            name: 'Perempuan',
            data: $data_p
        }]
    });
});
")?>
</div>
</div>

这些代码用于从数据库查询某些表。但我现在需要的是将我的 TableGender 显示为Yii2中的高级图。我该怎么做才能在Yii2中显示它?提前谢谢

1 个答案:

答案 0 :(得分:0)

Highcharts是javascript库,所以要从php array 变量传递参数,你需要将它编码为json格式。您可以使用php函数json_encode或内置函数Json::encode的yii2。所以,我相信你的代码应该是这样的:

use yii\helpers\Json;

...

<?php $this->registerJs("
$(function () {
    $('#my-chart').highcharts({
        ...
        xAxis: {
            categories:" . Json::encode($tahun) . "
        },
        ...
        series: [{
            name: 'Laki-laki',
            data:" . Json::encode($data_l) . "
        }, {
            name: 'Perempuan',
            data:" . Json::encode($data_p) . "
        }]
    });
});
")?>

希望有所帮助。

快乐的编码。 :)