README

基于 ChartJs 2 的 Yii2 widget

安装

安装此扩展的首选方式是通过 composer。

运行以下命令之一：

php composer.phar require --prefer-dist cenotia/yii2-chartjs-widget "*"

或者将以下内容添加到您的 composer.json 文件的 require 部分：

"cenotia/yii2-chartjs-widget": "*"

用法

安装扩展后，只需像这样在您的代码中使用它：

在视图中

<?php use cenotia\components\chartjs\ChartJs; ?>
<?= ChartJs::widget([
                   'type' => 'pie',//bar,line,pie,radar,polar, bubble
                   'options' => [
                       'height' => 180,
                       'width' => 180,

                   ],
                   'labelPercent' => true, //add percentage to the tooltips
                   'data' => [
                               'labels' => $data4['labels'],
                               'datasets' => [
                                       [
                                           'label'=> 'yourlables',
                                           'data'=> $data4['datasets'],
                                           'backgroundColor' => [
                                                              '#FF6384',
                                                              '#FFAA84',
                                                              '#56BB84',
                                                              '#87AA98',
                                                              '#8899AA',
                                                              '#5499CC'
                                                          ], //for 6 values. It could be set in the controller
                                       ]
                                   ]
                           ],

               ]);?>

在控制器中

        //your query returns 6 labels and 6 values
        //use function to get values and * 1 to turn then into numerals otherwise
        //it will strings and the if you use the percentages, it won't work.

        $command = $connection->createCommand("
                    select dimension, measure
                    from yourtable
                    where yourfilter
                    group by dimension
                    limit 6;                
	                   ");   
        $result4 = $command->queryAll();

        $data4 = [
            'labels' => ArrayHelper::getColumn($result4,'dimension'),
            'datasets' => ArrayHelper::getColumn($result4,function ($element) {
                    return $element['measure']*1;
                })
        ];

鸣谢

2amigos/yii2-chartjs-widget