GitHub-Proxy/signoz
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz synced 2025-07-31 08:41:57 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: dynamic step size for the data for graphs (#929)

Browse Source 
* feat: dynamic step size for the data for graphs

* fix: remove console.log

* chore: add jest globals

* feat: add step size for dashboard

* chore: undo .eslintignore
This commit is contained in:
Pranshu Chittora 2022-04-05 16:09:57 +05:30 committed by GitHub
parent a8c5934fc5
commit 566c2becdf
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 12 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/.eslintignore
View File

@ -1,2 +1,2 @@
node_modules
build
build

5
frontend/src/lib/__tests__/getStep.test.ts
View File

@ -1,6 +1,6 @@
import { expect } from '@jest/globals';
import dayjs from 'dayjs';
import getStep, { DefaultStepSize } from 'lib/getStep';
import getStep, { DefaultStepSize, MaxDataPoints } from 'lib/getStep';
describe('lib/getStep', () => {
test('should return default step when the given range is less than 1 day', () => {
@ -40,7 +40,8 @@ describe('lib/getStep', () => {
const startUnix = start.valueOf();
const endUnix = end.valueOf();
const expectedStepSize = end.diff(start, 'days') * DefaultStepSize;
const expectedStepSize = Math.floor(end.diff(start, 's') / MaxDataPoints);
expect(
getStep({
start: startUnix / 1e3,

9
frontend/src/lib/getStep.ts
View File

@ -30,6 +30,7 @@ const convertToMs = (
};
export const DefaultStepSize = 60;
export const MaxDataPoints = 200;
/**
* Returns relevant step size based on given start and end date.
@ -37,13 +38,9 @@ export const DefaultStepSize = 60;
const getStep = ({ start, end, inputFormat = 'ms' }: GetStepInput): number => {
const startDate = dayjs(convertToMs(Number(start), inputFormat));
const endDate = dayjs(convertToMs(Number(end), inputFormat));
const diffDays = Math.abs(endDate.diff(startDate, 'days'));
const diffSec = Math.abs(endDate.diff(startDate, 's'));
if (diffDays > 1) {
return DefaultStepSize * diffDays;
}
return DefaultStepSize;
return Math.max(Math.floor(diffSec / MaxDataPoints), DefaultStepSize);
};
export default getStep;

2
frontend/src/modules/Usage/UsageExplorer.tsx
View File

@ -84,7 +84,7 @@ function _UsageExplorer(props: UsageExplorerProps): JSX.Element {
if (selectedTime && selectedInterval) {
const maxTime = new Date().getTime() * 1000000;
const minTime = maxTime - selectedTime.value * 24 * 3600000 * 1000000;
getUsageData(minTime, maxTime, selectedInterval.value, selectedService);
}
}, [selectedTime, selectedInterval, selectedService, getUsageData]);

3
frontend/src/pages/Trace/index.tsx
View File

@ -5,6 +5,7 @@ import TraceGraph from 'container/Trace/Graph';
import Search from 'container/Trace/Search';
import TraceGraphFilter from 'container/Trace/TraceGraphFilter';
import TraceTable from 'container/Trace/TraceTable';
import getStep from 'lib/getStep';
import history from 'lib/history';
import React, { useCallback, useEffect, useState } from 'react';
import { connect, useDispatch, useSelector } from 'react-redux';
@ -84,7 +85,7 @@ function Trace({
selectedFilter,
selectedTags,
start: minTime,
step: 60,
step: getStep({ start: minTime, end: maxTime, inputFormat: 'ns' }),
isFilterExclude,
});
}, [

3
frontend/src/store/actions/dashboard/getQueryResults.ts
View File

@ -5,6 +5,7 @@ import { timePreferenceType } from 'container/NewWidget/RightContainer/timeItems
import GetMaxMinTime from 'lib/getMaxMinTime';
import GetMinMax from 'lib/getMinMax';
import GetStartAndEndTime from 'lib/getStartAndEndTime';
import getStep from 'lib/getStep';
import { Dispatch } from 'redux';
import store from 'store';
import AppActions from 'types/actions';
@ -45,7 +46,7 @@ export const GetQueryResults = (
end,
query: encodeURIComponent(query.query),
start,
step: '60',
step: `${getStep({ start, end, inputFormat: 'ms' })}`,
});
return {
query: query.query,