We switch the memory graph to a stacked area graph, similar to what we have now on the node summary page.
Since the order is important, we need to define the colors manually, as the default color scheme would switch the colors as we usually have them. Additionally we add the host memory view as another data series. But we keep it as a single line without fill. We chose the grey tone so that is works for both, bright and dark theme. Signed-off-by: Aaron Lauterer <a.laute...@proxmox.com> --- Notes: changes since: v3: * align column from maxmem-capped to memfree-capped * rename columns: * 'RAM Used' -> 'Used' * 'Configured' -> 'Free' www/manager6/panel/GuestSummary.js | 25 +++++++++++++++++++++++-- 1 file changed, 23 insertions(+), 2 deletions(-) diff --git a/www/manager6/panel/GuestSummary.js b/www/manager6/panel/GuestSummary.js index 0b62dbb7..77ec3e3f 100644 --- a/www/manager6/panel/GuestSummary.js +++ b/www/manager6/panel/GuestSummary.js @@ -30,6 +30,27 @@ Ext.define('PVE.guest.Summary', { var template = !!me.pveSelNode.data.template; var rstore = me.statusStore; + let memoryFields = [ + { + type: 'area', + yField: ['mem', 'memfree-capped'], + title: [gettext('Used'), gettext('Free')], + }, + ]; + if (type === 'qemu') { + memoryFields.push({ + type: 'line', + fill: false, + yField: 'memhost', + title: gettext('Host memory usage'), + hidden: true, + style: { + lineWidth: 2.5, + opacity: 1, + }, + }); + } + var items = [ { xtype: template ? 'pveTemplateStatusView' : 'pveGuestStatusView', @@ -82,8 +103,8 @@ Ext.define('PVE.guest.Summary', { xtype: 'proxmoxRRDChart', title: gettext('Memory usage'), pveSelNode: me.pveSelNode, - fields: ['maxmem', 'mem'], - fieldTitles: [gettext('Total'), gettext('RAM usage')], + fields: memoryFields, + colors: ['#115fa6', '#94ae0a', '#c4c0c0'], unit: 'bytes', powerOfTwo: true, store: rrdstore, -- 2.39.5 _______________________________________________ pve-devel mailing list pve-devel@lists.proxmox.com https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel