From 2af5b6cf292606ba925a30b5efab9c2902524e9c Mon Sep 17 00:00:00 2001 From: Mikael Sand Date: Thu, 3 Oct 2019 12:34:15 +0300 Subject: [PATCH] Update README.md Add more marker examples from svg 2.0 draft --- README.md | 97 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 97 insertions(+) diff --git a/README.md b/README.md index 9845ebbe4..56cca25ec 100644 --- a/README.md +++ b/README.md @@ -1094,6 +1094,103 @@ Code explanation: ![Marker](https://www.w3.org/TR/SVG11/images/painting/marker.svg) +```jsx +import React from 'react'; +import {StyleSheet, View} from 'react-native'; +import {SvgXml} from 'react-native-svg'; + +const markerRendering = ` + + + + + + + + + + + + + +`; + +export default class App extends React.Component { + render() { + return ( + + + + ); + } +} + +const styles = StyleSheet.create({ + container: { + backgroundColor: 'white', + justifyContent: 'center', + alignItems: 'center', + flex: 1, + }, +}); +``` + +![MarkerDoubled](https://www.w3.org/TR/SVG2/images/painting/marker-doubled.svg) + +```jsx +import React from 'react'; +import {StyleSheet, View} from 'react-native'; +import {SvgXml} from 'react-native-svg'; + +const markerRendering = ` + + + + + + + + + + +`; + +export default class App extends React.Component { + render() { + return ( + + + + ); + } +} + +const styles = StyleSheet.create({ + container: { + backgroundColor: 'white', + justifyContent: 'center', + alignItems: 'center', + flex: 1, + }, +}); +``` + +![MarkerRendering](https://www.w3.org/TR/SVG2/images/painting/marker-rendering.svg) + +Code explanation: + #### Touch Events Touch events are supported in react-native-svg. These include: