dennii/dbgate
1
0
Fork 0
mirror of https://github.com/DeNNiiInc/dbgate.git synced 2026-04-21 15:16:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

charts

Browse Source
This commit is contained in:
Jan Prochazka
2020-12-06 11:01:58 +01:00
parent 3bb22ddc36
commit fd2747d166
3 changed files with 45 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
packages/web/src/charts/DataChart.js
View File

@@ -1,9 +1,11 @@
import React from 'react';
import _ from 'lodash';
import Chart from 'react-chartjs-2';
import randomcolor from 'randomcolor';
import styled from 'styled-components';
import useDimensions from '../utility/useDimensions';
import { useForm } from '../utility/FormProvider';
import { saturateByTenth } from '../theme/colorUtil';
const ChartWrapper = styled.div`
flex: 1;
@@ -13,18 +15,29 @@ const ChartWrapper = styled.div`
function createChartData(freeData, labelColumn, dataColumns, colorSeed, chartType) {
if (!freeData || !labelColumn || !dataColumns || dataColumns.length == 0) return {};
const colors = randomcolor({
count: freeData.rows.length,
count: _.max([freeData.rows.length, dataColumns.length, 1]),
seed: colorSeed,
});
let backgroundColor = null;
let borderColor = null;
const res = {
labels: freeData.rows.map((x) => x[labelColumn]),
datasets: dataColumns.map((dataColumn) => ({
label: dataColumn,
data: freeData.rows.map((row) => row[dataColumn]),
backgroundColor: chartType != 'line' ? colors : null,
borderColor: chartType == 'line' ? colors : null,
borderWidth: 1,
})),
datasets: dataColumns.map((dataColumn, columnIndex) => {
if (chartType == 'line' || chartType == 'bar') {
backgroundColor = colors[columnIndex];
borderColor = saturateByTenth(backgroundColor);
} else {
backgroundColor = colors;
}
return {
label: dataColumn,
data: freeData.rows.map((row) => row[dataColumn]),
backgroundColor,
borderColor,
borderWidth: 1,
};
}),
};
return res;