diff options
| author | Georgios Andreadis <G.Andreadis@student.tudelft.nl> | 2017-11-03 21:59:48 +0100 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2017-11-03 21:59:48 +0100 |
| commit | 2f71cb1c9fd3e649a1f0e6f713922a73372f064e (patch) | |
| tree | ac4e0885738286277b7e8b2276d7b67aac293f01 | |
| parent | 285026488df4c82c3f31fe093a4f44c579331ac0 (diff) | |
| parent | d6f2296d60399fa0156c3908fa63e61fb0e3b4bf (diff) | |
Merge pull request #53 from atlarge-research/feature/31/current-tick-label
Add label to current tick line in state charts
| -rw-r--r-- | src/components/app/sidebars/elements/LoadChartComponent.js | 11 |
1 files changed, 10 insertions, 1 deletions
diff --git a/src/components/app/sidebars/elements/LoadChartComponent.js b/src/components/app/sidebars/elements/LoadChartComponent.js index 6f66010e..5f0d40cb 100644 --- a/src/components/app/sidebars/elements/LoadChartComponent.js +++ b/src/components/app/sidebars/elements/LoadChartComponent.js @@ -4,6 +4,7 @@ import SvgSaver from "svgsaver"; import { VictoryAxis, VictoryChart, + VictoryLabel, VictoryLine, VictoryScatter } from "victory"; @@ -56,9 +57,17 @@ const VictoryChartComponent = ({ data, currentTick, showCurrentTick }) => ( <VictoryScatter data={data} /> {showCurrentTick ? ( <VictoryLine + labelComponent={ + <VictoryLabel renderInPortal angle={90} dy={-5} dx={60} /> + } data={[{ x: currentTick + 1, y: 0 }, { x: currentTick + 1, y: 1 }]} + labels={point => + point.y === 1 + ? "Current tick : " + convertSecondsToFormattedTime(currentTick) + : ""} style={{ - data: { stroke: "#00A6D6", strokeWidth: 3 } + data: { stroke: "#00A6D6", strokeWidth: 4 }, + labels: { fill: "#00A6D6" } }} /> ) : ( |