README

稳定版

开发版

PHPChartJS

PHP 对象模型库，用于 ChartJS

PHPChartJS 作为 ChartJS 库和服务器端代码之间的接口。轻松设置图表，并通过 PHP 代码管理图表的各个方面。此接口旨在在任何情况下都提供代码自动完成，因此您无需猜测或查找所选图表的可用的选项。该库完全是面向对象的。

此库仍在积极开发中，旨在实现 ChartJS 提供的所有选项。请查看 配置里程碑 以查看实现所有现有选项的进度。

示例用法

<?php
use Nutsy\PHPChartJS\Chart\Bar;

$bar = new Bar();
$bar->setId("myBar");

// Set labels
$bar->labels()->exchangeArray(["M", "T", "W", "T", "F", "S", "S"]);

// Add apples
$apples = $bar->createDataSet();
$apples->setLabel("apples")
  ->setBackgroundColor("rgba( 0, 150, 0, .5 )")
  ->data()->exchangeArray([12, 19, 3, 17, 28, 24, 7]);
$bar->addDataSet($apples);

// Add oranges as well
$oranges = $bar->createDataSet();
$oranges->setLabel("oranges")
  ->setBackgroundColor("rgba( 255, 153, 0, .5 )")
  ->data()->exchangeArray([ 30, 29, 5, 5, 20, 3 ]);
  
// Add some extra data
$oranges->data()->append(10);

$bar->addDataSet($oranges);

// Render the chart
echo $bar->render();

渲染图表生成的结果将类似于以下内容

<canvas id="myBar"></canvas>
<script>
window.onload=(function(oldLoad){return function(){
if( oldLoad ) oldLoad();
var ctx = document.getElementById( "myBar" ).getContext( "2d" );
var chart = new Chart( ctx, {"type":"bar","data":{"labels":["M","T","W","T","F","S","S"],"datasets":[{"data":[12,19,3,17,28,24,7],"label":"apples","backgroundColor":"rgba( 0, 150, 0, .5 )"},{"data":[30,29,5,5,20,3,10],"label":"oranges","backgroundColor":"rgba( 255, 153, 0, .5 )"}]}} );
}})(window.onload);
</script>

回调函数

您可以轻松提供 JavaScript 回调函数

$myCallback = "function(item){ console.log(item); }";
$bar->options()->getTooltips()->callbacks()->setAfterBody($myCallback);

渲染

渲染图表会创建一些 HTML 和一些 JavaScript。JavaScript 包含一个 JSON 对象，提供必要的配置信息以供 ChartJS 使用。配置的每一部分都可以转换为数组或 JSON 对象。

渲染配置的独立部分

$json = $myChart->options()->getScales()->jsonSerialize();

或返回包含设置的配置的数组

$options = $myChart->options()->getScales()->getArrayCopy();

美观模式

如果您不喜欢生成的长代码行，可以强制渲染以 美观模式 进行，以下是一个示例。

// Render in pretty mode
$bar->render(true);

想看更多吗？分支此项目并查看测试文件夹中的示例以探索不同的选项。

配置选项

ChartJS 支持的所有选项都将在此库中提供。

层

ChartJS 要求您构建一个包含您希望为当前图表设置的配置选项的 JSON 对象。这些选项分散在配置对象的多个层中。使用 PHPChartJS 访问这些层非常简单。

假设我们想访问选项树中的 getAnimation 子树

$getAnimation = $myChart->options()->getAnimation();

现在，您可以使用该类提供的获取器和设置器调整 ChartJS 的 getAnimation 设置。

集合

如果 ChartJS 在配置选项中需要具有特定项的数组作为子集，则该数组在 PHPChartJS 中将表示为集合。该集合始终可以直接访问以添加、删除和替换值。

在某些情况下，需要具有预定选项列表的特定对象作为集合的一部分。在这些情况下，将提供方法来创建该对象的新的实例并将其添加到集合中。

数据集存储在集合中

// Create new dataset
$dataset = $myChart->createDataSet();
... (add data to the dataset)
$myChart->addDataSet($dataset);

但数据集的实际数据也存储在集合中

// Create new dataset
$dataset = $myChart->createDataSet();

// Add some data 
$dataset->data()->append(1)->append(2);

// Prepend some data
$dataset->data()->prepend(0);

// Replace data at certain position
$dataset->data()->offsetSet(1, 3);

// Retrieve data from certain position
$value = $dataset->data()->offsetGet(1); // 3

// Add a lot of data at once whilst returning the old values
$oldData = $dataset->data()->exchangeArray([1, 2, 3]); // array(3) { [0]=> int(1) [1]=> int(2) [2]=> int(3) }

$myChart->addDataSet($dataset);

有关集合的更多信息，请访问 Nutsyam/collection 项目。

安装

使用 composer

$ composer require Nutsyam/phpchartjs

开发版

此项目使用 composer，应在您的系统上安装。大多数 Linux 系统的 PHP 软件包中都提供了 composer。或者，您可以从 getcomposer.org 下载 composer。

如果您使用PhpStorm IDE，则可以通过IDE简单地初始化composer。然而，要充分发挥其功能，则需要使用命令行。请参阅PhpStorm帮助文档，搜索composer。

要开始开发，请在项目目录中执行composer install。

备注除非您在composer.json中更改了依赖要求，否则不要使用composer update。两者的区别在于，composer install将只以只读方式使用composer.lock文件，而composer update将更新您的composer.lock文件，不管是否有任何更改。因为composer.lock文件已提交到仓库，其他开发者可能会得出依赖项已更改的结论，而实际上它们并没有。