65 lines
No EOL
1.6 KiB
TypeScript
65 lines
No EOL
1.6 KiB
TypeScript
import { View } from "react-native";
|
|
import { PieChart } from "react-native-chart-kit";
|
|
|
|
const Graph = () => {
|
|
|
|
// const {data, isLoading, reFetch} = useFetch({sql: "SELECT c.name AS name, c.color AS color, SUM(e.amount) as total FROM category c LEFT JOIN expense e ON e.category_guid = c.guid GROUP BY c.guid", args: []});
|
|
|
|
// useEffect(() => {
|
|
// console.log(data);
|
|
// }, [data])
|
|
|
|
const data = [
|
|
{
|
|
name: "Seoul",
|
|
population: 21500000,
|
|
color: "rgba(131, 167, 234, 1)",
|
|
legendFontColor: "#7F7F7F",
|
|
legendFontSize: 15
|
|
},
|
|
{
|
|
name: "Toronto",
|
|
population: 2800000,
|
|
color: "#F00",
|
|
legendFontColor: "#7F7F7F",
|
|
legendFontSize: 15
|
|
},
|
|
{
|
|
name: "Beijing",
|
|
population: 527612,
|
|
color: "red",
|
|
legendFontColor: "#7F7F7F",
|
|
legendFontSize: 15
|
|
},
|
|
{
|
|
name: "New York",
|
|
population: 8538000,
|
|
color: "#ffffff",
|
|
legendFontColor: "#7F7F7F",
|
|
legendFontSize: 15
|
|
},
|
|
{
|
|
name: "Moscow",
|
|
population: 11920000,
|
|
color: "rgb(0, 0, 255)",
|
|
legendFontColor: "#7F7F7F",
|
|
legendFontSize: 15
|
|
}
|
|
];
|
|
|
|
|
|
return (
|
|
<View>
|
|
<PieChart
|
|
data={data}
|
|
height={600}
|
|
width={600}
|
|
chartConfig={chartConfig}
|
|
accessor="population"
|
|
style={graphStyle}
|
|
/>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
export default Graph; |