yriveiro/php-highcharts

PHP API mapping for JavaScript library Highcharts.

Highcharts

, _(*1)

PHP wrapper for the awesome JavaScript library Highcharts, _(*2)

Install

The simplest way to install this library is through the dependency manager Composer. Create a composer.json and add the following configuration., _(*3)

"require": {
    "yriveiro/php-highcharts": "0.1.*"
}

After just run the command php composer.phar install to installed it as a part of your project., _(*4)

Components

This library is composed by two main pieces, a main class Highchart responsible to build the chart and a render engine class XEngine responsible of the rendering the JavaScript code., _(*5)

In this version the default (and only) render engine it's the JQueryEngine but is very easy create a new engine., _(*6)

To create a new engine class, this must extend the AbstractEngine class and implements the method AbstractEngine::renderJavaScript()., _(*7)

Usage

Use this library it's very simple. You can create a Highchart or a Highstock using the Highchart constructor., _(*8)

use Highcharts\Highchart;
use Highcharts\JQueryEngine;

$chart = new Highchart();

Set

After this the $chart variable is all you need to start the configuration of the chart., _(*9)

$chart->set('chart.renderTo', 'container');
$chart->set('title.text', 'Monthly Average Temperature');
$chart->set('title.x', -20);

The set method uses a key and a value to set the properties to the $chart object. As you can see the way to define the $key is using dot notation., _(*10)

$chart->set('subtitle.text', 'Source: WorldClimate.com');
$chart->set('subtitle.x', -20);

To set an array of values to the xAxis.categories properties:, _(*11)

$chart->set(
    'xAxis.categories',
    array('Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec')
);

Append

There is some properties of the Highchart that accept arrays, to define this properties the method to be used will be append instead set. In the case that the property doesn't have any previous value will be created with the appended value., _(*12)

$chart->append(
    'yAxis.plotLines',
    array(
        'value' => 0,
        'width' => 1,
        'color' => '#808080'
    )
);

The same process it's applied to the series property., _(*13)

$chart->append(
    'series',
    array(
        'name' => 'Tokyo',
        'data' => array(
            7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6,
        )
    )
);

$chart->append(
    'series',
    array(
        'name' => 'New York',
        'data' => array(
            -0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5
        )
    )
);

$chart->append(
    'series',
    array(
        'name' => 'Berlin',
        'data' => array(
            -0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0
        )
    )
);

JavaScript Expressions

Also exists the possibility that some properties uses an javascript expression as value, to render this expressions corretly they should be create using the Expr class from the class Zend\Json\Expr., _(*14)

$chart->set(
    'legend.backgroundColor',
    new Expr('(Highcharts.theme && Highcharts.theme.legendBackgroundColor || "#FFFFFF")')
);

Render

To render the chart the last thing to do is call the render method of the $chart object with an engine as the first parameter, optionally you can pass a second parameter that will add the <script></script> tags to the result, by default it's set to true., _(*15)

$chart->render(new JQueryEngine());
````

By default the ``JQueryEngine`` renders a Highchart chart, if you want render a Highstock chart the way to do passing to the ``JQueryEngine`` the constant ``JQueryEngine::HIGHSTOCK``.

```php
$chart->render(new JQueryEngine(JQueryEngine::HIGHSTOCK))

Examples

There is a set of expamples into the example folder., _(*16)