File elements/chart.php

  1   2   3   4   5   6   7   8   9  10  11  12  13  14  15  16  17  18  19  20  21  22  23  24  25  26  27  28  29  30  31  32  33  34  35  36  37  38  39  40  41  42  43  44  45  46  47  48  49  50  51  52  53  54  55  56  57  58  59  60  61  62  63  64  65  66  67  68  69  70  71  72  73  74  75  76  77  78  79  80  81  82  83  84  85  86  87  88  89  90  91  92  93  94  95  96  97  98  99 100 101 102 103 104 105 106

<?php

namespace SIW\Elements;

use SIW\HTML;

/**
 * Class om een chart te genereren
 * 
 * @copyright 2019 SIW Internationale Vrijwilligersprojecten
 * @since     3.0.0
 * 
 * @see       https://github.com/apexcharts/apexcharts.js
 */
abstract class Chart {
    
    /**
     * Frappe Charts versie
     * 
     * @param string
     */
    const FRAPPE_CHARTS_VERSION = '1.3.0';

    /**
     * Type grafiek
     *
     * @var string
     */
    protected $type;

    /**
     * Data voor grafiek
     *
     * @var array
     */
    protected $data = [];

    /**
     * Opties voor grafiek
     *
     * @var array
     */
    protected $options = [];

    /**
     * Genereert grafiek
     *
     * @param array $data
     * @param string $title
     * @return string
     */
    public function generate( array $data, array $options = [] ) {
        $this->data = $data;
        $this->options = wp_parse_args_recursive( $options, $this->options );

        $this->enqueue_scripts();
        $this->enqueue_styles();

        $attributes = [
            'id'           => uniqid( "siw-{$this->type}-chart-"),
            'class'        => 'siw-chart',
            'data-options' => $this->generate_chart_options(),
        ];
        return HTML::generate_tag( 'div', $attributes, null, true ) ;
    }

    /**
     * Voegt scripts toe
     */
    protected function enqueue_scripts() {
        wp_register_script( 'frappe-charts', SIW_ASSETS_URL . 'modules/frappe-charts/frappe-charts.js', ['polyfill'], self::FRAPPE_CHARTS_VERSION, true );
        wp_register_script( 'siw-charts', SIW_ASSETS_URL . 'js/elements/siw-charts.js', [ 'frappe-charts' ], SIW_PLUGIN_VERSION, true );
        wp_enqueue_script( 'siw-charts' );
    }

    /**
     * Voegt styles toe
     */
    protected function enqueue_styles() {
        wp_register_style( 'frappe-charts', SIW_ASSETS_URL . 'modules/frappe-charts/frappe-charts.css', [], self::FRAPPE_CHARTS_VERSION );
        wp_enqueue_style( 'frappe-charts' );
    }

    /**
     * Genereert opties voor grafiek
     *
     * @return array
     */
    protected function generate_chart_options() {

        $options = wp_parse_args_recursive(
            $this->options,
            [
                'data'  => $this->generate_chart_data(),
                'type'  => $this->type,
            ]
        );
        return $options;
    }

    /**
     * Genereert data voor grafiek
     */
    abstract protected function generate_chart_data();
}

Namespaces

Classes

Functions