Skip to content

Visualizer: How to populate chart series and data dynamically ​

The Visualizer plugin allows you to write your own hooks for chart series and data filters. The global filter is applied for each chart every time a chart is prepared to be rendered. If you want to create a hook for the global filter, use visualizer-get-chart-series and visualizer-get-chart-data filters for series and data accordingly. Each hook for these filters receives three arguments: the data or series array, chart ID, and chart type variable.

In this article

Series global filter ​

To create a hook for the global series filter you need to write the following function:

add_filter( 'visualizer-get-chart-series', 'myplugin_filter_charts_series', 10, 3 );
function myplugin_filter_charts_series( $series, $chart_id, $type ) {
    // do your stuff here
    return $series;
}

The $series array contains the actual series of the chart and has the following structure:

$series = array(
    // the first series
    array(
        'label' => 'The name', // the label of the series
        'type' => 'string', // the type of the series
    ),
    // the second series
    array(
        ...
    ),
    // and so on...
);

Data global filter ​

To create a hook for global data filter you need to write the following function:

add_filter( 'visualizer-get-chart-data', 'myplugin_filter_charts_data', 10, 3 );
function myplugin_filter_charts_data( $data, $chart_id, $type ) {
    // do your stuff here
    return $data;
}

The $data array contains actual data of the chart and has the following structure:

$data = array(
    // the first row of data
    array(
        'Something', // the value of the first series
        165, // the value of the second series
        32, // the value of the third series
    ),
    // the second row of data
    array(
        ...
    ),
    // and so on...
);

Settings global filter ​

To create a hook for the global settings filter you need to write the following function:

add_filter( 'visualizer-get-chart-settings', 'myplugin_filter_charts_settings', 10, 3 );
function myplugin_filter_charts_settings( $data, $chart_id, $type ) {
    // do your stuff here
    return $data;
}
Was this helpful?