library yii2-jqplot {🖫 2, ⚐ 6, ★ 0}

stekky81/yii2-jqplot

Yii2 jqPlot widget renders charts and graphs based on jQuery Plotting Plugin

Wednesday, October 19, 2016
by stekky81
Repository
1 Watchers
0 Stars
2 Installations

JavaScript
0 Dependents
0 Suggesters
2 Forks
0 Open issues
6 Versions
0 % Grown

The README.md

This extension provides jqPlot integration for the Yii framework 2.0., _(*1)

jqPlot is a plotting and charting plugin for the jQuery Javascript framework. jqPlot produces beautiful line, bar and pie charts with many features:, _(*2)

Numerous chart style options.
Date axes with customizable formatting.
Up to 9 Y axes.
Rotated axis text.
Automatic trend line computation.
Tooltips and data point highlighting.
Sensible defaults for ease of use.

Computation and drawing of lines, axes, shadows even the grid itself is handled by pluggable "renderers". Not only are the plot elements customizable, plugins can expand functionality of the plot too! There are plenty of hooks into the core jqPlot code allowing for custom event handlers, creation of new plot types, adding canvases to the plot, and more!, _(*3)

Numerous line style options with 6 built in marker styles! Horizontal and vertical Bar charts! Shadow control on lines, markers, the grid, everything! , _(*4)

Drag and drop points with auto updating of data! Log Axes with flexible tick marks! Trend lines computed automatically! , _(*5)

Installation

Package is available on Packagist, you can install it using Composer., _(*6)

composer require sizeg/yii2-jqplot

Basic usage

echo JqPlot::widget([
    'data' => [[1, 2],[3,5.12],[5,13.1],[7,33.6],[9,85.9],[11,219.9]]
]);

The following example will render a bar chart:, _(*7)

echo JqPlot::widget([
    'data' => [
        [2, 6, 7, 10],
        [7, 5, 3, 2],
        [14, 9, 3, 8],
    ],
    'clientOptions' => [
        'stackSeries' => true,
        'captureRightClick' => true,
        'seriesDefaults'  => [
            'renderer' => new JsExpression("$.jqplot.BarRenderer"),
            'rendererOptions' => [
                'highlightMouseDown' => true,
            ],
            'pointLabels' => [
                'show' => true,
            ],
        ],
        'legend' => [
            'show' => true,
            'location' => 'e',
            'placement' => 'outside',
        ]
    ]
]);