Stack Overflow
Stack Overflow

Questions tagged [react-native-svg]

Use for react-native-svg, a JavaScript library to use\write SVG images in react-native

react-native-svg is a JavaScript library that provides both iOS and Android to be able to use\write SVG images in react-native. SVG or Scalable Vector Graphics are a kind of images that are produced by using XML scripts. This makes the images to be able to be indexed, searched and compressed. These images are interactive due to the scripts, and can also be animated thus.

https://www.npmjs.com/package/react-native-svg

275 questions
1
vote
1 answer

how can I make image take full shape size of SVG path?

I'm trying to fill the frame shape (svg path) with image of each player (dynamic image)
FaysalB
  • 330
  • 1
  • 11
1
vote
0 answers

how to create react native header as svg/ and manipulating the svg?

I'm trying to create my custom header component for a react native app, import React from 'react' import { StatusBar } from 'react-native' import Svg, { Path } from 'react-native-svg' export default function App () { StatusBar.setHidden(true) …
FaysalB
  • 330
  • 1
  • 11
1
vote
1 answer

React native svg charts border radius from top

import React from 'react' import { BarChart, Grid } from 'react-native-svg-charts' import { Defs, LinearGradient, Stop } from "react-native-svg"; class ColorBarExample extends React.PureComponent { render() { const data = [ …
Rover
  • 661
  • 2
  • 18
  • 39
1
vote
1 answer

Hide some dots in Line Chart - react-native-chart-kit

I'm working on Line Chart with react-native-chart-kit. What I'm trying to achieve is, to show dot on a specific data point only and hide dots for all other points. Is it possible? How can I accomplish this? This is what I need to display:
Hanzla
  • 214
  • 5
  • 15
1
vote
1 answer

How to add dots to the points on my line chart in react-native-svg-charts?

I am able to plot the line chart using react-native-svg-charts, now i want to plot dots on the points in the dataset like shown below, it is provided in the library itself, but i cannot figure out how to use it.
Ankush
  • 61
  • 4
1
vote
0 answers

Can't compile react-native-svg on react-native-windows

I'm working on a react-native-windows UWP application and trying to install react-native-svg but I'm stuck compiling for windows. This project references NuGet package(s) that are missing on this computer. Use NuGet Package Restore to download…
Luca
  • 31
  • 4
1
vote
1 answer

React Native SVG loading indicator for remote SVGs

I am rendering SVGs from remote URLs: import { SvgUri } from "react-native-svg"; function RemoteSVG() { return (
Pranava Mohan
  • 533
  • 2
  • 8
  • 18
1
vote
0 answers

Add fixed color in LinearGradient using react-native-svg

I am workign on a Svg component where i'm using LinearGradient from react-native-svg. I want to used fixed colors on stop points. But using LinearGradient, it's not being possible to do that. How can i add fixed color and achieve something like…
Tanmoy Sarker
  • 1,176
  • 2
  • 14
  • 38
1
vote
0 answers

Real-time line charting with React-Native

I'm new to drawing a graph with react-native. The problem is, I can read the data sent with Ble as a value on the screen, but I'm having trouble making real-time graphs. There must be a mistake somewhere. I tried many different methods. The code…
cans
  • 67
  • 7
1
vote
0 answers

react-native-svg path does not fill whole svg height

My path fills the SVG horizontally perfectly by vertically it has spacing to the top and bottom as you can see. How can I remove that spacing and have the path fill the entire height of the SVG element? Here is my code and a screenshot of the SVG…
Hugo
  • 2,073
  • 6
  • 23
  • 46
1
vote
0 answers

SvgUri from react-native-svg is always undefined when importing

In a react native application, the import for SvgUri from react-native-svg always returns undefined throwing the following error: index.js:1 Warning: React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for…
NewVigilante
  • 1,291
  • 1
  • 7
  • 23
1
vote
0 answers

Invariant Violation: View config getter callback for component `g` must be a function (received `undefined`)

The whole message is Invariant Violation: View config getter callback for component `g` must be a function (received `undefined`). Make sure to start component names with a capital letter. This error is located at: in g in…
Meng Marilyn
  • 11
  • 2
1
vote
1 answer

react-native-chart-kit Pie chart any modification or any property

In react-native-chart-kit Pie chart is there any property or modification to set legend like this?? and also click to show tooltip ?.
Tushar Kotecha
  • 764
  • 2
  • 7
  • 27
1
vote
1 answer

react-native-svg - Fill overlapped area of two ellipses

We are using react-native-svg library to draw ellipses having following code
iphonic
  • 12,615
  • 7
  • 60
  • 107
1
vote
0 answers

react-native-svg chart, moving cursor along has a delay

I'm trying to move a dot along my svg chart following the user's thumb on the screen, however, I am getting an offset when doing so, which means it won't follow the user's thumb but instead will always be a little behind and that offset increases as…
Hugo
  • 2,073
  • 6
  • 23
  • 46
1 2 3
…
18 19