Improve createProfilingChart function and remove duplicate code

Signed-off-by: Liviu-Mihail Concioiu <liviu.concioiu@gmail.com>
This commit is contained in:
Liviu-Mihail Concioiu 2025-09-04 00:32:17 +02:00
parent 4c34850c0b
commit cf80ac28bb
3 changed files with 10 additions and 28 deletions

View File

@ -1,15 +1,16 @@
import { CommonParams } from '../common.ts';
/**
* Creates a Profiling Chart. Used in sql.js
* and in server/status/monitor.js
* Creates a Profiling Chart. Used in sql.ts
* and in server/status/monitor.ts
*
* @param {string} target
* @param {any[]} data
* @param {any[]} chartData
* @param {string} legendPosition
*
* @return {object}
*/
export default function createProfilingChart (target, data) {
export default function createProfilingChart (target, chartData, legendPosition) {
const lang = CommonParams.get('lang');
const numberFormat = new Intl.NumberFormat(lang.replace('_', '-'), {
style: 'unit',
@ -20,10 +21,10 @@ export default function createProfilingChart (target, data) {
return new window.Chart(target, {
type: 'pie',
data: { labels: data.map(row => row[0]), datasets: [{ data: data.map(row => row[1]) }] },
data: { labels: chartData.labels, datasets: [{ data: chartData.data }] },
options: {
plugins: {
legend: { position: 'right' },
legend: { position: legendPosition },
tooltip: { callbacks: { label: context => context.parsed ? numberFormat.format(context.parsed) : '' } },
},
},

View File

@ -2211,7 +2211,7 @@ AJAX.registerOnload('server/status/monitor.js', function () {
return false;
});
profilingChart = createProfilingChart('queryProfilingCanvas', chartData);
profilingChart = createProfilingChart('queryProfilingCanvas', chartData, 'right');
}
});

View File

@ -4,6 +4,7 @@ import { AJAX } from './modules/ajax.ts';
import { checkFormElementInRange, checkSqlQuery, prepareForAjaxRequest } from './modules/functions.ts';
import { Navigation } from './modules/navigation.ts';
import { CommonParams } from './modules/common.ts';
import createProfilingChart from './modules/functions/createProfilingChart.ts';
import highlightSql from './modules/sql-highlight.ts';
import { ajaxRemoveMessage, ajaxShowMessage } from './modules/ajax-message.ts';
import { escapeBacktick, escapeHtml } from './modules/functions/escape.ts';
@ -1369,27 +1370,7 @@ function buildProfilingChart () {
return;
}
const lang = CommonParams.get('lang');
const numberFormat = new Intl.NumberFormat(lang.replace('_', '-'), {
style: 'unit',
unit: 'second',
unitDisplay: 'long',
notation: 'engineering',
});
new window.Chart(profilingChartCanvas, {
type: 'pie',
data: {
labels: chartData.labels,
datasets: [{ data: chartData.data }],
},
options: {
plugins: {
legend: { position: 'bottom' },
tooltip: { callbacks: { label: context => context.parsed ? numberFormat.format(context.parsed) : '' } },
},
},
});
createProfilingChart('profilingChartCanvas', chartData, 'bottom');
}
/**