Contents
Snippet #
Important: All snippets are provided as-is without support or guarantees. These snippets are provided as guidelines for advanced users looking to customize LearnDash. For any additional help or support with these snippets, we recommend reaching out to a LearnDash Expert.
/**
* LearnDash ProPanel Filter Chart data
*
* @since 2.0
*
* @args $chart_info array Multi-demensional array of chart options and attributes.
*
* @return $chart_info Modified chart array
*
*
* The $chart_info array contains multiple sections. Each section start with the section for each of the two charts:
* [all_progress] - This is the data for the 'Chart Distribution' chart showing the breakdown Not Started, In Progress and Completed states.
* [all_percentages] - This is the data for the 'Chart Distribution' chart showing the breakdown of the In Progress states.
*
* Within each of these chart sections will be two sections:
* [query] - The query section contains the data points used for the display of the chart. Each data point is itself an array containing specific keys for label, backgroundColor, hoverBackgroundColor and data. a typical data point may be something like the following section for the not started data point. These data points can be removed as needed. In the case of the [all_percentages] chart these data points sections can be used to control the breakdown of the percentages displayed in the chart.
* [not_started] => Array(
* [label] => Not Started
* [backgroundColor] => #2D97C5
* [hoverBackgroundColor] => #2D97C5
* [data] => 0
* )
*
* [options] - This is the display options for the Chart.js like font-size, color, etc. The default strucutre is as follows:
* [options] => Array
* (
* [tooltips] => Array
* (
* [backgroundColor] => #3B3E44
* [titleMarginBottom] => 15
* [titleFontSize] => 18
* [cornerRadius] => 4
* [bodyFontSize] => 14
* [xPadding] => 10
* [yPadding] => 15
* [bodySpacing] => 10
* [fontFamily] => 'Open Sans',sans-serif
* )
*
* [legend] => Array
* (
* [display] => 1
* [labels] => Array
* (
* [boxWidth] => 14
* [fontFamily] => 'Open Sans',sans-serif
* )
*
* )
*
* )
*
*/
// The 'ld_propanel_chart_info_query' filter is called before any data queries are performed.
add_filter( 'ld_propanel_chart_info_query', function( $chart_info = array() ) {
// Some changes to the $chart_info structure.
// return the modified $chart_info array
return $chart_info;
} );
// The 'ld_propanel_chart_info_results' filter is called after all data queries have been performed to allow any changes before the chart data is displayed.
add_filter( 'ld_propanel_chart_info_results', function( $chart_info = array() ) {
// Some changes to the $chart_info structure.
// return the modified $chart_info array
return $chart_info;
} );
/*
* Below is a full $chart_info data structure.
*
* chart_info<pre>Array
* (
* [all_progress] => Array
* (
* [query] => Array
* (
* [not_started] => Array
* (
* [label] => Not Started
* [backgroundColor] => #2D97C5
* [hoverBackgroundColor] => #2D97C5
* [data] => 0
* )
*
* [in_progress] => Array
* (
* [label] => In Progress
* [backgroundColor] => #5BAED2
* [hoverBackgroundColor] => #5BAED2
* [data] => 0
* )
*
* [completed] => Array
* (
* [label] => Completed
* [backgroundColor] => #8AC5DF
* [hoverBackgroundColor] => #8AC5DF
* [data] => 0
* )
*
* )
*
* [options] => Array
* (
* [tooltips] => Array
* (
* [backgroundColor] => #3B3E44
* [titleMarginBottom] => 15
* [titleFontSize] => 18
* [cornerRadius] => 4
* [bodyFontSize] => 14
* [xPadding] => 10
* [yPadding] => 15
* [bodySpacing] => 10
* [fontFamily] => 'Open Sans',sans-serif
* )
*
* [legend] => Array
* (
* [display] => 1
* [labels] => Array
* (
* [boxWidth] => 14
* [fontFamily] => 'Open Sans',sans-serif
* )
*
* )
*
* )
*
* )
*
* [all_percentages] => Array
* (
* [query] => Array
* (
* [20] => Array
* (
* [label] => < 20%
* [backgroundColor] => #2D97C5
* [hoverBackgroundColor] => #2D97C5
* [data] => 0
* )
*
* [40] => Array
* (
* [label] => < 40%
* [backgroundColor] => #5BAED2
* [hoverBackgroundColor] => #5BAED2
* [data] => 0
* )
*
* [60] => Array
* (
* [label] => < 60%
* [backgroundColor] => #8AC5DF
* [hoverBackgroundColor] => #8AC5DF
* [data] => 0
* )
*
* [80] => Array
* (
* [label] => < 80%
* [backgroundColor] => #B9DCEB
* [hoverBackgroundColor] => #B9DCEB
* [data] => 0
* )
*
* [100] => Array
* (
* [label] => < 100%
* [backgroundColor] => #E7F3F8
* [hoverBackgroundColor] => #E7F3F8
* [data] => 0
* )
*
* )
*
* [options] => Array
* (
* [tooltips] => Array
* (
* [backgroundColor] => #3B3E44
* [titleMarginBottom] => 15
* [titleFontSize] => 18
* [cornerRadius] => 4
* [bodyFontSize] => 14
* [xPadding] => 10
* [yPadding] => 15
* [bodySpacing] => 10
* [fontFamily] => 'Open Sans',sans-serif
* )
*
* [legend] => Array
* (
* [display] => 1
* [labels] => Array
* (
* [boxWidth] => 14
* [fontFamily] => 'Open Sans',sans-serif
* )
*
* )
*
* )
*
* )
*
* )
*/