wpDataTables includes chart integrations with multiple chart engines, but at this time, we only have a workaround to skip NULL and/or 0 values when using the HighCharts Engine.
For other chart engines, there is currently no built-in method or workaround to skip these values.
To apply this workaround, you’ll need to add custom code to the functions.php
file of your theme or child theme.
Example: Skip both NULL and 0 values
function filterNullValues($value, $origHeader, $chartID, $tableID) {
// You can add conditions for specific headers, chart IDs, or table IDs if needed
if (is_null($value) || $value == 0 || intval($value) == 0) {
$value = null;
}
return $value;
}
add_filter('wpdatatables_filter_int_cell_data_in_charts', 'filterNullValues', 10, 4);
add_filter('wpdatatables_filter_float_cell_data_in_charts', 'filterNullValues', 10, 4);
Example: Skip only NULL values
function filterNullValues($value, $origHeader, $chartID, $tableID) {
if (is_null($value)) {
$value = null;
}
return $value;
}
add_filter('wpdatatables_filter_int_cell_data_in_charts', 'filterNullValues', 10, 4);
add_filter('wpdatatables_filter_float_cell_data_in_charts', 'filterNullValues', 10, 4);
Example: Skip only 0 values
function filterNullValues($value, $origHeader, $chartID, $tableID) {
if ($value == 0) {
$value = null;
}
return $value;
}
add_filter('wpdatatables_filter_int_cell_data_in_charts', 'filterNullValues', 10, 4);
add_filter('wpdatatables_filter_float_cell_data_in_charts', 'filterNullValues', 10, 4);
Important Notes:
You do not need to change this code after wpDataTables updates.
Keep this code in your theme or child theme’s functions.php
file.
You can add additional conditions (e.g., apply only to a specific chart ID or column header).
If you want HighCharts to connect lines across missing values (NULLs), you can use the connectNulls option via a chart callback:
<script type="text/javascript">
jQuery(window).on('load', function() {
if (typeof wpDataChartsCallbacks == 'undefined') { wpDataChartsCallbacks = {}; }
wpDataChartsCallbacks[16] = function(obj) {
obj.options.plotOptions = {
series: {
connectNulls: true
}
}
};
});
</script>
Replace [16]
with your actual chart ID.
Summary:
This workaround works only with the HighCharts Engine.
It lets you skip NULL values, 0 values, or both.
You can optionally connect skipped NULL values in line charts.