react-svg-draw
A React component for the SVG Elements.
Install
npm install --save react-svg-draw or yarn add react-svg-draw
Usage
const React = const SVG = const Circle = SVG;React
TAGS Available
- <SVG />
- <SVG.A />
- <SVG.Animate />
- <SVG.AnimateMotion />
- <SVG.AnimateTransform />
- <SVG.Circle />
- <SVG.Defs />
- <SVG.Ellipse />
- <SVG.G />
- <SVG.Image />
- <SVG.Line />
- <SVG.Path />
- <SVG.Polygon />
- <SVG.Polyline />
- <SVG.Rect />
- <SVG.Symbol />
- <SVG.Text />
- <SVG.THref />
- <SVG.TSpan />
- <SVG.Use />
Examples
Regular usage
var React = const SVG = const Circle Defs G Rect Use = SVG; var MyComponent = React
With ES6 JS
Component { return <SVG> <Defs> <G id="shape"> <Rect x="50" y="50" width="50" height="50" /> <Circle cx="50" cy="50" r="50" /> </G> </Defs> <Use xlinkHref="#shape" x="50" y="50" /> <Use xlinkHref="#shape" x="200" y="50" /> </SVG> }