README

这是MorrisJS小部件。它是一个非常简单的API，用于绘制折线和柱状图。

安装

安装此扩展的首选方法是使用composer。检查composer.json以获取此扩展的要求和依赖关系。

要安装，请运行

$ composer require antishov/yii2-morrisjs

或添加

"antishov/yii2-morrisjs": "@stable"

到您的composer.json文件的require部分。

用法

折线图

代码示例

use antishov\Morris;
use yii\web\JsExpression;

echo Morris\Line::widget([
     'resize' => true,
     'gridTextSize' => 11,
     'element' => 'lineChart',
     'data' => [
         ['date' => '2017-06-14', 'value' => 2],
         ['date' => '2017-06-15', 'value' => 4],
         ['date' => '2017-06-16', 'value' => 1]
     ],
     'xKey' => 'date',
     'yKeys' => ['value'],
     'labels' => ['Impressions'],
     'xLabels' => 'day',
     'yLabelFormat' => new JsExpression(
         'function (y) {if (y === parseInt(y, 10)) {return y;}else {return "";}}'
     ),
     'yMin' => 'auto 40',
     'lineColors' => ['rgb(123, 204, 221)'],
     'pointFillColors' => ['rgb(82, 188, 211)'],
 ]);

属性

resize - 设置为true以启用在包含元素大小调整时的自动调整大小。（默认：false）。这会对性能产生重大影响，因此默认禁用。

gridTextSize - 设置轴标签的点大小（默认：12）。

element - 将分配给图表的标识符。

data - 要绘制的数据。这是一个包含x和y属性的数组，这些属性由xkey和ykeys选项描述。

xKey - 包含日期（X）值的属性名称的字符串（有关可用格式，请参阅规范）。

yKeys - 包含Y值属性名称的字符串列表（每个要绘制的数据系列一个）。

labels - 包含要绘制的数据系列标签的字符串列表（对应于ykeys选项中的值）。

xLabels - 设置x轴标签间隔。默认情况下，间隔将自动计算（请参阅规范中的有效间隔字符串）。

yLabelFormat - 接受y值并格式化为y轴标签的函数。

yMin - Y值的最大值。或者，将其设置为'auto'以自动计算，或设置为'auto [num]'以自动计算并确保最小y值不超过[num]。

lineColors - 系列线条/点的颜色数组。

pointFillColors - 系列点的颜色。默认情况下使用与lineColors相同的值。

柱状图

use antishov\Morris;
use yii\web\JsExpression;

echo Morris\Bar::widget([
     'element' => 'barChart',
     'data' => [
         ['date' => '2017-06-14', 'value' => 2.36],
         ['date' => '2017-06-15', 'value' => 0.79],
         ['date' => '2017-06-16', 'value' => 9.99]
     ],
     'xKey' => 'date',
     'yKeys' => ['value'],
     'labels' => ['Revenue'],
     'barColors' => ['rgb(82, 188, 211)', 'rgb(49, 167, 193)'],
 ]);

属性

element - 将分配给图表的标识符。

data - 要绘制的数据。这是一个包含x和y属性的数组，这些属性由xkey和ykeys选项描述。

xKey - 包含日期（X）值的属性名称的字符串（有关可用格式，请参阅规范）。

yKeys - 包含Y值属性名称的字符串列表（每个要绘制的数据系列一个）。

labels - 包含要绘制的数据系列标签的字符串列表（对应于ykeys选项中的值）。

barColors - 系列柱子的颜色数组。

示例

所有示例都存储在example子目录中，并基于Yii2框架和Docker。您可以自由设置自己的主机。

请参阅Dockerfile和docker-compose.yml以获取更多信息。

许可

yii2-morrisjs是在MIT许可下发布的。有关详细信息，请参阅捆绑的LICENSE.md。