Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
小 白蛋
Clutch
Commits
9dbbd5ee
Commit
9dbbd5ee
authored
3 years ago
by
SHAWNA MONERO
Browse files
Options
Download
Email Patches
Plain Diff
add stories and funcs
parent
327aad52
No related merge requests found
Changes
2
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
frontend/packages/core/src/Charts/helpers.tsx
+8
-1
frontend/packages/core/src/Charts/helpers.tsx
frontend/packages/core/src/stories/timeseries.stories.tsx
+21
-0
frontend/packages/core/src/stories/timeseries.stories.tsx
with
29 additions
and
1 deletion
+29
-1
frontend/packages/core/src/Charts/helpers.tsx
+
8
-
1
View file @
9dbbd5ee
// TODO: add more formatting funcs
export
const
localTimeFormatter
=
(
timestamp
:
number
)
=>
{
return
new
Date
(
timestamp
).
toLocaleTimeString
();
};
export
const
isoTimeFormatter
=
(
timestamp
:
number
)
=>
{
return
new
Date
(
timestamp
).
toISOString
();
};
export
const
dateTimeFormatter
=
(
timestamp
:
number
)
=>
{
return
new
Date
(
timestamp
).
toDateString
();
};
const
getMinAndMaxOfRangeUsingKey
=
(
data
:
any
,
key
:
string
)
=>
{
const
filtered
=
data
.
filter
(
d
=>
d
[
key
]).
map
(
d
=>
d
[
key
]);
return
{
min
:
Math
.
min
(...
filtered
),
max
:
Math
.
max
(...
filtered
)
};
...
...
This diff is collapsed.
Click to expand it.
frontend/packages/core/src/stories/timeseries.stories.tsx
+
21
-
0
View file @
9dbbd5ee
...
...
@@ -2,6 +2,7 @@ import * as React from "react";
import
styled
from
"
@emotion/styled
"
;
import
type
{
Meta
}
from
"
@storybook/react
"
;
import
{
dateTimeFormatter
,
isoTimeFormatter
}
from
"
../Charts/helpers
"
;
import
TimeseriesChart
,
{
TimeseriesReferenceLineProps
}
from
"
../Charts/timeseries
"
;
export
default
{
...
...
@@ -67,6 +68,26 @@ export const SingleDataLine = () => {
yDomainSpread
=
{
0.3
}
regularIntervalTicks
/>
<
TimeseriesChart
data
=
{
mockDataSingleLine
}
xAxisDataKey
=
"timestamp"
yAxisDataKey
=
"value"
lines
=
{
mockLines
}
xDomainSpread
=
{
0.3
}
yDomainSpread
=
{
0.3
}
regularIntervalTicks
tickFormatterFunc
=
{
isoTimeFormatter
}
/>
<
TimeseriesChart
data
=
{
mockDataSingleLine
}
xAxisDataKey
=
"timestamp"
yAxisDataKey
=
"value"
lines
=
{
mockLines
}
xDomainSpread
=
{
0.3
}
yDomainSpread
=
{
0.3
}
regularIntervalTicks
tickFormatterFunc
=
{
dateTimeFormatter
}
/>
</
ChartContainer
>
);
};
...
...
This diff is collapsed.
Click to expand it.
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment
Menu
Projects
Groups
Snippets
Help