35 lines
1.0 KiB
JavaScript
35 lines
1.0 KiB
JavaScript
import React from 'react';
|
|
import {View, StyleSheet, Text} from 'react-native';
|
|
|
|
//import Svg, {Polyline, Polygon, Rect, G} from 'react-native-svg-web';
|
|
import Svg, {Polyline, Polygon, Rect, G} from 'react-native-svg';
|
|
|
|
|
|
const Graph = props => {
|
|
const graphHeight = 100;
|
|
|
|
const data = props.data.slice(-600);
|
|
|
|
const coordStr = data.map((element, i) => `${i}, ${element / 2}`);
|
|
|
|
return (
|
|
<View style={{justifyContent: 'center', alignItems: 'center'}}>
|
|
<Svg height={graphHeight} width="80%" viewbox="0 0 100 100">
|
|
<G transform={"translate(0," + graphHeight.toString() + ") scale(1, -1)"}>
|
|
<Polyline
|
|
points={coordStr.join(" ")}
|
|
stroke="black"
|
|
strokeWidth="3"
|
|
strokeOpacity="0.5"
|
|
strokeLinejoin="round"
|
|
fill="none"
|
|
/>
|
|
</G>
|
|
</Svg>
|
|
</View>
|
|
);
|
|
};
|
|
|
|
|
|
export default Graph;
|