thomasdv/phpchartjs

PHP库用于ChartJS

安装: 157

依赖者: 0

建议者: 0

安全: 0

星标: 0

关注者: 0

分支: 14

类型:

v1.2.3 2022-09-15 13:54 UTC

This package is not auto-updated.

Last update: 2024-09-27 22:04:16 UTC


README

稳定

Latest Stable Version Total Downloads License composer.lock Build Status Code Climate Test Coverage Quality

开发

Latest Unstable Version Build Status

PHPChartJS

PHP面向对象库,用于ChartJS

PHPChartJS作为ChartJS库和服务器端代码之间的接口。轻松设置图表,并通过PHP代码管理图表的每个方面。此接口旨在在每种情况下提供代码补全,因此您永远不必猜测或查找所选图表的可用选项。该库完全面向对象。

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

示例用法

<?php
use Halfpastfour\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();

您现在可以通过该特定类中提供的getter和setter调整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);

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

安装

使用composer

$ composer require halfpastfouram/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文件已提交到仓库中,其他开发者可能会认为依赖项已更改,而实际上并没有。