PHPackages                             enscope/yii2-chartjs-widget - 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. enscope/yii2-chartjs-widget

ActiveYii2-extension[Utility & Helpers](/categories/utility)

enscope/yii2-chartjs-widget
===========================

Yii2 chart.js 2.0 widget

1.0.2(10y ago)01.0kBSD-3-Clause

Since Jun 7Compare

[ Source](https://github.com/enscope/yii2-chartjs-widget)[ Packagist](https://packagist.org/packages/enscope/yii2-chartjs-widget)[ Docs](http://www.enscope.com)[ RSS](/packages/enscope-yii2-chartjs-widget/feed)WikiDiscussions Synced today

READMEChangelogDependencies (1)Versions (2)Used By (0)

yii2-chartjs-widget
===================

[](#yii2-chartjs-widget)

Yii2 Chart widget with support for chart.js 2.0.

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

[](#installation)

To install the widget in your application, run

```
composer require enscope/yii2-chartjs-widget:~1.0

```

or add

```
"enscope/yii2-chartjs-widget" : "~1.0"

```

to the require section of your application's composer.json file.

It is possible to use the source code directly, but it is recommended to use `composer`, for your own good.

Basic Usage
-----------

[](#basic-usage)

Main class of the widget is `ChartJsWidget`, which is the only one you need in your views. Basic configuration goes like this:

```
{ChartJsWidget::widget([
    'chartType' => ChartJsWidget::CHART_LINE,
    'canvasOptions' => [
        'height' => 200
    ],
    'chartOptions' => [
        'animation' => false,
        'bezierCurve' => false,
        'maintainAspectRatio' => false,
        'responsive' => true,
        'tooltips' => [
            'callbacks' => [
                'label' => ChartJsWidget::js('function (item) { return (item.yLabel + "%"); }')
            ]
        ]
    ],
    'chartData' => $chartData
])}

```

All supported chart types are defined as constants:

```
const CHART_LINE = 'line';
const CHART_BAR = 'bar';
const CHART_RADAR = 'radar';
const CHART_POLAR_AREA = 'polarArea';
const CHART_PIE = 'pie';
const CHART_DOUGHNUT = 'doughnut';

```

To include javascript callbacks in configuration, `ChartJsWidget::js(..)` helper is available to allow for simple expression instantiation even for users, who are using `Smarty` as a templating engine for their app (like in this case). The helper simply instantiates `yii\web\JsExpression` with specified string.

The properties of the widget are as follows:

- **$id** is user-definable HTML5 Canvas identifier for the widget, but can be left blank and is auto-generated in that case
- **$canvasOptions** are the HTML attributes directly injected into the `` tag
- **$chartType** is one of the before-mentioned chart types supported by chart.js library (in case, there are some new chart types and the widget is lagging behind, you can always freely use strings as chart type names, but it is recommended to use the constants)
- **$chartData** is the data of the chart, directly set to `data` key of the `Chart()` configuration
- **$chartOptions** are the configuration `options` of the chart

Planned Enhancements
--------------------

[](#planned-enhancements)

- support of global chart defaults
- chart-specific data and options classes to simplify instantiation

Acknowledgments
---------------

[](#acknowledgments)

This widget was inspired by [2amigOS! ChartJs widget](http://github.com/2amigos/yii2-chartjs-widget), which unfortunatelly was not available for chart.js 2.0, so I decided to create a new one with some inspiration borrowed in terms of basic structure.

###  Health Score

28

—

LowBetter than 52% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity14

Limited adoption so far

Community2

Small or concentrated contributor base

Maturity63

Established project with proven stability

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.

###  Release Activity

Cadence

Unknown

Total

1

Last Release

3675d ago

### Community

Maintainers

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

---

Tags

yii2extensionwidgetchartchartjschartjs2

### Embed Badge

![Health badge](/badges/enscope-yii2-chartjs-widget/health.svg)

```
[![Health](https://phpackages.com/badges/enscope-yii2-chartjs-widget/health.svg)](https://phpackages.com/packages/enscope-yii2-chartjs-widget)
```

###  Alternatives

[onmotion/yii2-widget-apexcharts

Yii2 charts widget - wrapper for the ApexCharts.js

1960.0k1](/packages/onmotion-yii2-widget-apexcharts)[richardfan1126/yii2-js-register

Yii2 widget to register JS into view

1358.5k7](/packages/richardfan1126-yii2-js-register)

PHPackages © 2026

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