-
Notifications
You must be signed in to change notification settings - Fork 0
/
TaskScoreChart.js
63 lines (49 loc) · 1.38 KB
/
TaskScoreChart.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
import React from 'react'
import {View, Text} from 'react-native';
import { Grid, BarChart, XAxis } from 'react-native-svg-charts'
// const colors = [ '#33691E', '#689F38', '#9CCC65', '#DCEDC8' ]
const fill = '#7986cb';
export default class TaskScoreChart extends React.Component {
constructor(props) {
super(props);
}
render() {
let taskscore = {};
let data = [ 0 ], i = 0;
let views = [];
for (let i in this.props.tasks) {
let t = this.props.tasks[i];
taskscore[t.short_name] = 0;
views.push(
<View style={{flex: 1}} key={t.short_name}>
<Text style={{fontFamily: 'monospace', fontSize: 10, textAlign: "center"}}>{t.short_name}</Text>
</View>
);
}
for (let i in this.props.subs) {
let s = this.props.subs[i];
taskscore[s["task"]] = Math.max(taskscore[s["task"]], s["score"]);
}
for (let i in this.props.tasks) {
let t = this.props.tasks[i];
data[i] = taskscore[t.short_name];
i += 1;
}
return (
<View style={{height: 150, paddingTop: 5}}>
<BarChart
style={{ height: 120 }}
svg={{ fill }}
data={ data }
gridMin={0}
gridMax={100}
numberOfTicks={0}>
<Grid />
</BarChart>
<View style={{flexDirection: "row"}}>
{views}
</View>
</View>
)
}
}