PHPackages                             xddesigners/silverstripe-charts - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. xddesigners/silverstripe-charts

ActiveSilverstripe-vendormodule[Utility & Helpers](/categories/utility)

xddesigners/silverstripe-charts
===============================

Create chart.js charts in Silverstripe.

154PHP

Since Nov 14Pushed 5mo ago2 watchersCompare

[ Source](https://github.com/xddesigners/silverstripe-charts)[ Packagist](https://packagist.org/packages/xddesigners/silverstripe-charts)[ RSS](/packages/xddesigners-silverstripe-charts/feed)WikiDiscussions main Synced 1mo ago

READMEChangelogDependenciesVersions (2)Used By (0)

Silverstripe Charts
===================

[](#silverstripe-charts)

Create chart.js charts with Silverstripe. Chart object can be rendered in the template. Chart configuration and info:

Installation
------------

[](#installation)

Install with Composer:

```
composer require xddesigners/silverstripe-charts

```

Usage
-----

[](#usage)

```
// add includes
use XD\Charts\Charts\Chart;
use XD\Charts\Charts\DataSet;

// example of usage
$type='bar';

$chart = new Chart();
$config = $chart->getConfig();
$config->setType($type)
$config->setTitle('Your chart title');
$config->setSubtitle('Your chart subtitle');
$config->setLegendPosition('top');
$config->setLegendTitle('Legend title');
$config->setLegendLabelSize(15,15);
$config->setPadding(10);

// bar example options
if( $type=='bar' ) {
    $config->setOption('scales.x.stacked',true);
    $config->setOption('scales.y.stacked',true);
}

// line example options
if( $type=='line' ) {
    $config->setOption('scales.x.stacked',true);
    $config->setOption('scales.y.stacked',true);
}

if (in_array($type, ['pie'])) {
    $config->showDataLabels();
    $config->setOption('plugins.datalabels.anchor','end');
    $config->setOption('plugins.datalabels.align','end');
}

// radar example options
if( $type=='radar' ) {
    $config->setOption('scales.r.angleLines.color','red');
    $config->setOption('scales.r.grid.color','blue');
    $config->setOption('scales.r.pointLabels.color','green');
    $config->setOption('scales.r.ticks.color','orange');
    $config->setOption('scales.r.min',0);
    $config->setOption('scales.r.max',100);
}

// pie example options
if( $type=='pie' ){
    $config->setOption('plugin.legend',false);
    $config->setOption('plugin.outlabels', [
            'text' => '%l %p',
            'color'=>'white',
            'stretch'=> 45,
            'font' => [
                'resizable' => 'true',
                'minSize' => 12,
                'maxSize' => 18
            ]
        ]
    );
}

// $config->setLegendDisplay(false);
$data = $config->getData();
$data->setLabels([
    'Eating',
    'Drinking',
    'Sleeping',
    'Designing',
    'Coding',
    'Cycling',
    'Running'
]);

$dataSet = new DataSet();
$dataSet->setLabel('Dataset 1');
$dataSet->setData([65, 59, 90, 81, 56, 55, 40]);
$dataSet->setBorderWidth(1);
$dataSet->setFill('origin');
$dataSet->setOption('pointStyle','square');
$dataSet->setOption('pointRadius','10');

// $dataSet->setBackgroundColor(['red','blue','orange','pink','green']);
$data->addDataSet($dataSet);

$dataSet = new DataSet();
$dataSet->setLabel('Dataset 2');
$dataSet->setFill(1);
$dataSet->setData([10, 50, 50, 50, 96, 50, 60]);
$dataSet->setBackgroundColor([
    'rgba(255, 205, 86, 0.7)',
    'rgba(75, 192, 192, 0.7)',
    'rgba(54, 162, 235, 0.7)',
    'rgba(153, 102, 255, 0.7)',
    'rgba(201, 203, 207, 0.7)',
    'rgba(255, 99, 132, 0.7)',
    'rgba(255, 159, 64, 0.7)',
]);
// $dataSet->setBorderColor(['red','rgba(255,0,0,0.8)','orange','pink','green', 'yellow', 'grey']);
// $dataSet->setBorderColor(['pink']);
// $dataSet->setBorderWidth(4);
$data->addDataSet($dataSet);
//
// getter and setters can be used like this as well
$dataSet = DataSet::create()
    ->setLabel('Label of dataset 3')
    ->setData([45, 39, 20, 31, 16, 55, 40])
    ->setFill(2);
// $dataSet->setBorderWidth(5);
// $dataSet->setBorderColor(['purple']);
// $dataSet->setBackgroundColor(['red','blue','orange','pink','green']);
$data->addDataSet($dataSet);

return $chart;

```

###  Health Score

21

—

LowBetter than 19% of packages

Maintenance47

Moderate activity, may be stable

Popularity11

Limited adoption so far

Community8

Small or concentrated contributor base

Maturity15

Early-stage or recently created project

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

### Community

Maintainers

![](https://www.gravatar.com/avatar/e35b3b006174e7015e9711c27bdee08fb707a816a434276c22dcb6327185c35b?d=identicon)[RVXD](/maintainers/RVXD)

---

Top Contributors

[![RVXD](https://avatars.githubusercontent.com/u/1586761?v=4)](https://github.com/RVXD "RVXD (10 commits)")

---

Tags

chartjschartssilverstripesilverstripe-module

### Embed Badge

![Health badge](/badges/xddesigners-silverstripe-charts/health.svg)

```
[![Health](https://phpackages.com/badges/xddesigners-silverstripe-charts/health.svg)](https://phpackages.com/packages/xddesigners-silverstripe-charts)
```

###  Alternatives

[mikemccabe/json-patch-php

Produce and apply json-patch objects

1124.9M7](/packages/mikemccabe-json-patch-php)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)