0👍
You can render shapes in React Native using React-Native ART
Import { Art } from 'react-native';
const { Shape, Group Surface } = ART;
You can create shapes using ‘d3-shape’ npm package https://github.com/d3/d3-shape/blob/master/README.md .
D3-shape will give you the ‘path’. for example:
var arc = d3.arc()
.innerRadius(0)
.outerRadius(100)
.startAngle(0)
.endAngle(Math.PI / 2);
When you execute this function it will return a long string of letters and numbers which can be used to draw your shape.
Simply, put it into React-Native ART’s shape like so:
render() {
return (
<Surface>
<Group>
<Shape d={arc()} /.
</Group>
</Surface>
)
}
Also this is a good article: https://hswolff.com/blog/react-native-art-and-d3/
Source:stackexchange.com