the introduction of the NumericBase2 segmenter in commit 9531c65 (rrd chart: fix y-axis segmentation when using powerOfTwo)
changed the way the axes are defined and created. The commit message noted that we can't override the axes config anymore but that we did not use that. It actually was used in the PMG dashboard with the 'MiniGraph' subclass. Luckily the configs were similar enough so that it did not matter much, so nobody seemed to notice. On recent examination of the charts, the labels of the axes were overlapping each other in certain conditions, and then it became apparent that the customization there for the axis did not apply anymore. To fix it, move the axes definition back to the class config, and overwrite the segmenter on each left or right 'numeric' axis if necessary. By overwriting it in 'config.axes' (and me.config.axes as fallback) we're able to use: * a default config (from the class definition, lands in `me.config`) * a subclass override (lands also in `me.config`) * overrides on actual creation (lands in `config`) I examined if we can override/set this config later e.g. in the initComponent, since a manual override + class config would be merged there, but it seems that the chart initializes the axes already before the initComponent. Using 'setSegmenter' later on is also not possible really, because for some reason this only changes the top-most point in the axis labels, but not the intermediate ones. Signed-off-by: Dominik Csapak <[email protected]> --- src/panel/RRDChart.js | 42 ++++++++++++++++++++++++++---------------- 1 file changed, 26 insertions(+), 16 deletions(-) diff --git a/src/panel/RRDChart.js b/src/panel/RRDChart.js index 148015c..82615ce 100644 --- a/src/panel/RRDChart.js +++ b/src/panel/RRDChart.js @@ -173,6 +173,21 @@ Ext.define('Proxmox.widget.RRDChart', { padding: 0, style: 'cursor: pointer;', }, + axes: [ + { + type: 'numeric', + position: 'left', + grid: true, + renderer: 'leftAxisRenderer', + minimum: 0, + }, + { + type: 'time', + position: 'bottom', + grid: true, + fields: ['time'], + }, + ], listeners: { redraw: { fn: 'onAfterAnimation', @@ -191,22 +206,17 @@ Ext.define('Proxmox.widget.RRDChart', { let me = this; let segmenter = config.powerOfTwo ? 'numericBase2' : 'numeric'; - config.axes = [ - { - type: 'numeric', - position: 'left', - grid: true, - renderer: 'leftAxisRenderer', - minimum: 0, - segmenter, - }, - { - type: 'time', - position: 'bottom', - grid: true, - fields: ['time'], - }, - ]; + + let axes = config.axes ?? me.config.axes ?? []; + for (const axis of axes) { + if ( + axis.type === 'numeric' && + (axis.position === 'left' || axis.position === 'right') + ) { + axis.segmenter = segmenter; + } + } + me.callParent([config]); }, -- 2.47.3 _______________________________________________ pve-devel mailing list [email protected] https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel
