|
|
@ -4,24 +4,65 @@ import { StyleSheet, Text, View } from "react-native"; |
|
|
|
import Screen from "../components/Screen"; |
|
|
|
import { dimensions, scaleDimsFromWidth } from "../config/dimensions"; |
|
|
|
import colors from "../config/colors/"; |
|
|
|
import { |
|
|
|
LineChart, |
|
|
|
BarChart, |
|
|
|
PieChart, |
|
|
|
ProgressChart, |
|
|
|
ContributionGraph, |
|
|
|
StackedBarChart |
|
|
|
} from "react-native-chart-kit"; |
|
|
|
|
|
|
|
import { FontAwesome5 } from '@expo/vector-icons'; |
|
|
|
import { MaterialIcons } from "@expo/vector-icons"; |
|
|
|
import { Dimensions } from "react-native"; |
|
|
|
|
|
|
|
|
|
|
|
const dims = scaleDimsFromWidth(85, 85, 25); |
|
|
|
|
|
|
|
|
|
|
|
function PluviometerDiaryScreen(props) { |
|
|
|
//Substituir por dados vindos da API
|
|
|
|
const school = "Escola registrada do pluviômetro"; |
|
|
|
const profile = "Tipo de perfil do usuário"; |
|
|
|
const local = "Endereço registrado do pluviômetro" |
|
|
|
|
|
|
|
const screenWidth = Dimensions.get("window").width; |
|
|
|
|
|
|
|
const data = { |
|
|
|
labels: ["January", "February", "March", "April", "May"], |
|
|
|
datasets: [ |
|
|
|
{ |
|
|
|
data: [0, 10, 20, 35, 40, 60], |
|
|
|
color: () => colors.gold, // optional
|
|
|
|
strokeWidth: 2 // optional
|
|
|
|
} |
|
|
|
], |
|
|
|
legend: ["Registros pluviometricos"] // optional
|
|
|
|
}; |
|
|
|
const chartConfig = { |
|
|
|
backgroundGradientFrom: 0, |
|
|
|
backgroundGradientFromOpacity: 0, |
|
|
|
backgroundGradientTo: "#08130D", |
|
|
|
backgroundGradientToOpacity: 0, |
|
|
|
color: () => colors.primary, |
|
|
|
strokeWidth: 2, // optional, default 3
|
|
|
|
barPercentage: 0.5, |
|
|
|
useShadowColorFromDataset: false // optional
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
<Screen style={styles.container}> |
|
|
|
<View style={{ flex: 1 }}> |
|
|
|
<Text style={{ textAlign: "center" }}> |
|
|
|
Gráfico do pluviometro |
|
|
|
</Text> |
|
|
|
|
|
|
|
<LineChart |
|
|
|
data={data} |
|
|
|
width={screenWidth} |
|
|
|
height={200} |
|
|
|
chartConfig={chartConfig} |
|
|
|
withVerticalLines={false} |
|
|
|
/> |
|
|
|
</View> |
|
|
|
<View |
|
|
|
style={{ |
|
|
|