IntenseWebs/pgadmin4
3
0
Fork 0
mirror of https://github.com/pgadmin-org/pgadmin4.git synced 2025-02-25 18:55:31 -06:00
Code Issues Packages Projects Releases Wiki Activity

Fixed the following issues in the Graph Visualiser:

Browse Source 
1) Change all theme's color codes.
 2) Bar graph for the first and last labels on the X-axis does not display all the bars.
 3) Make the graphs always start from zero on the Y-axis.
This commit is contained in:
Akshay Joshi 2022-07-05 18:44:20 +05:30
parent 8b62cd1f04
commit 7414394ceb
2 changed files with 18 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
web/pgadmin/static/js/chartjs/index.jsx
View File

@ -15,20 +15,18 @@ import _ from 'lodash';
export const DATA_POINT_STYLE = ['circle', 'cross', 'crossRot', 'rect',
'rectRounded', 'rectRot', 'star', 'triangle'];
export const DATA_POINT_SIZE = 3;
export const CHART_THEME_COLORS_LENGTH = 24;
export const CHART_THEME_COLORS_LENGTH = 20;
export const CHART_THEME_COLORS = {
'standard':['#3366CC', '#DC3912', '#FF9900', '#109618', '#990099', '#0099C6',
'#DD4477', '#66AA00', '#B82E2E', '#316395', '#994499', '#22AA99',
'#AAAA11', '#6633CC', '#E67300', '#8B0707', '#651067', '#329262',
'#5574A6', '#3B3EAC', '#B77322', '#16D620', '#B91383', '#F4359E'],
'dark': ['#7371FC', '#3A86FF', '#979DAC', '#D4A276', '#2A9D8F', '#FFEE32',
'#70E000', '#FF477E', '#7DC9F1', '#52B788', '#E4E487', '#2EC4B6',
'#DB7C74', '#8AC926', '#FF8FA3', '#B388EB', '#FB5607', '#EEA236',
'#EDC531', '#D4D700', '#FFFB69', '#7FCC5C', '#50B0F0', '#00B4D8'],
'high_contrast': ['#FF6C49', '#00B4D8', '#45D48A', '#FFFB69', '#B388EB',
'#D4A276', '#2EC4B6', '#7DC9F1', '#50B0F0', '#52B788', '#70E000',
'#7FCC5C', '#8AC926', '#979DAC', '#D4D700', '#DEFF00', '#E4E487',
'#EDC531', '#EEA236', '#F8845F', '#FB4BF6', '#FF8FA3', '#FFEE32', '#FFFFFF']
'standard':['#1F77B4', '#FF7F0E', '#2CA02C', '#D62728', '#9467BD', '#8C564B',
'#E377C2', '#7F7F7F', '#BCBD22', '#17BECF', '#3366CC', '#DC3912', '#FF9900',
'#109618', '#990099', '#0099C6','#DD4477', '#66AA00', '#B82E2E', '#316395'],
'dark': ['#4878D0', '#EE854A', '#6ACC64', '#D65F5F', '#956CB4', '#8C613C',
'#DC7EC0', '#797979', '#D5BB67', '#82C6E2', '#7371FC', '#3A86FF', '#979DAC',
'#D4A276', '#2A9D8F', '#FFEE32', '#70E000', '#FF477E', '#7DC9F1', '#52B788'],
'high_contrast': ['#023EFF', '#FF7C00', '#1AC938', '#E8000B', '#8B2BE2',
'#9F4800', '#F14CC1', '#A3A3A3', '#FFC400', '#00D7FF', '#FF6C49', '#00B4D8',
'#45D48A', '#FFFB69', '#B388EB', '#D4A276', '#2EC4B6', '#7DC9F1', '#50B0F0',
'#52B788']
};
const defaultOptions = {

7
web/pgadmin/tools/sqleditor/static/js/components/sections/GraphVisualiser.jsx
View File

@ -97,12 +97,14 @@ function GenerateGraph({graphType, graphData, ...props}) {
x: {
display: true,
stacked: false,
offset: true,
ticks: {
display: true,
},
},
y: {
stacked: false,
beginAtZero: true,
},
},
}));
@ -123,6 +125,11 @@ function GenerateGraph({graphType, graphData, ...props}) {
usePointStyle: (showDataPoints && useDiffPointStyle) ? true : false
},
},
},
scales: {
x: {
offset: false
}
}
}));