| @@ -985,11 +985,12 @@ | ||
| 985 | 985 | } |
| 986 | 986 | return $has_point ? $out : false; |
| 987 | 987 | } |
| 988 | 988 | |
| 989 | -// X scale options for time-axis mode; gvnSqlChartsTimeTick (asset/front.js) formats the ticks as dates | |
| 989 | +// X scale options for time-axis mode (globals from asset/front.js): gvnSqlChartsTimeTicks replaces the evenly | |
| 990 | +// spaced ticks Chart.js generates on a linear scale with the actual data dates, gvnSqlChartsTimeTick formats them | |
| 990 | 991 | function guaven_sqlcharts_time_axis_scale(){ |
| 991 | - return "type: 'linear', offset: true, ticks: {callback: gvnSqlChartsTimeTick, maxRotation: 45},"; | |
| 992 | + return "type: 'linear', offset: true, afterBuildTicks: gvnSqlChartsTimeTicks, ticks: {callback: gvnSqlChartsTimeTick, maxRotation: 45, autoSkip: true},"; | |
| 992 | 993 | } |
| 993 | 994 | // extra entry for the Chart.js "plugins" object in time-axis mode (tooltip title shown as a date) |
| 994 | 995 | function guaven_sqlcharts_time_axis_plugins($time_points){ |
| 995 | 996 | return $time_points !== false ? 'tooltip: {callbacks: {title: gvnSqlChartsTimeTooltipTitle}}' : ''; |
| @@ -1027,9 +1028,9 @@ | ||
| 1027 | 1028 | echo wp_kses(guaven_sqlcharts_colorgenerator(count($points), 0, 0.2, guaven_sqlcharts_colors($i, $pid)),[]); |
| 1028 | 1029 | ?> |
| 1029 | 1030 | ], |
| 1030 | 1031 | borderWidth: 1, |
| 1031 | - <?php if ($time_points !== false) echo 'maxBarThickness: 48,'; ?> | |
| 1032 | + <?php if ($time_points !== false) echo 'barThickness: 24,'; // fixed width: on a time axis Chart.js would otherwise size bars from the closest pair of dates ?> | |
| 1032 | 1033 | data: [<?php |
| 1033 | 1034 | echo wp_kses(implode(",", $points),[]); |
| 1034 | 1035 | ?>], |
| 1035 | 1036 | }, |
