React-native-svg-charts: RNSVGLine error - I can't use any chart type

Created on 8 Dec 2018  路  3Comments  路  Source: JesperLekland/react-native-svg-charts

I am trying to get started with this library, but I get this error each time I want to render any chart. This error has appeared here in Issues already, but was closed with no solution provided. Reportedly it disappeared for OP after creating new project, but it did not for me.

Invariant Violation: requireNativeComponent: "RNSVGLine" was not found in the UIManager.

This error is located at:
    in RNSVGLine (at Line.js:33)
    in Line (at grid.js:31)
    in RNSVGGroup (at G.js:25)
    in G (at grid.js:28)
    in Vertical (at grid.js:81)
    in Grid (at horizontal.js:22)
    in RNSVGSvgView (at Svg.js:94)
    in Svg (at bar-chart.js:184)
    in RCTView (at View.js:45)
    in RCTView (at View.js:45)
    in BarChart (at bar-chart/index.js:12)
    in BarChartGate (at horizontal.js:13)
    in RCTView (at View.js:45)
    in BarChartExample (at App.js:12)
    in RCTView (at View.js:45)
    in RCTView (at View.js:45)
    in App (at renderApplication.js:34)
    in RCTView (at View.js:45)
    in RCTView (at View.js:45)
    in AppContainer (at renderApplication.js:33)
getNativeComponentAttributes
    index.delta?platform=android&dev=true&minify=false:38530:14
<unknown>
    index.delta?platform=android&dev=true&minify=false:38483:42
get
    index.delta?platform=android&dev=true&minify=false:32805:28
createInstance
    index.delta?platform=android&dev=true&minify=false:10228:59
completeWork
    index.delta?platform=android&dev=true&minify=false:16487:48
completeUnitOfWork
    index.delta?platform=android&dev=true&minify=false:18490:44
performUnitOfWork
    index.delta?platform=android&dev=true&minify=false:18653:36
workLoop
    index.delta?platform=android&dev=true&minify=false:18663:47
renderRoot
    index.delta?platform=android&dev=true&minify=false:18734:21
performWorkOnRoot
    index.delta?platform=android&dev=true&minify=false:19454:23
performWork
    index.delta?platform=android&dev=true&minify=false:19381:30
performSyncWork
    index.delta?platform=android&dev=true&minify=false:19357:20
batchedUpdates$1
    index.delta?platform=android&dev=true&minify=false:19540:28
batchedUpdates
    index.delta?platform=android&dev=true&minify=false:9315:37
_receiveRootNodeIDEvent
    index.delta?platform=android&dev=true&minify=false:9372:23
receiveEvent
    index.delta?platform=android&dev=true&minify=false:9378:32
__callFunction
    index.delta?platform=android&dev=true&minify=false:2460:49
<unknown>
    index.delta?platform=android&dev=true&minify=false:2233:31
__guard
    index.delta?platform=android&dev=true&minify=false:2414:15
callFunctionReturnFlushedQueue
    index.delta?platform=android&dev=true&minify=false:2232:21

This is my package.json:

{
  "name": "reactCharts",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "d3-array": "^1.2.0",
    "d3-scale": "^1.0.6",
    "d3-shape": "^1.0.6",
    "date-fns": "^1.28.5",
    "react": "16.6.1",
    "react-native": "0.57.7",
    "react-native-svg": "^6.3.1",
    "react-native-svg-charts": "^5.1.1"
  },
  "devDependencies": {
    "@storybook/addon-actions": "^3.3.14",
    "@storybook/addon-links": "^3.3.14",
    "@storybook/addons": "^3.3.14",
    "@storybook/react-native": "^3.3.14",
    "babel-jest": "23.6.0",
    "jest": "23.6.0",
    "metro-react-native-babel-preset": "0.50.0",
    "prop-types": "^15.6.0",
    "react-dom": "16.2.0",
    "react-test-renderer": "16.6.1"
  },
  "jest": {
    "preset": "react-native"
  }
}

All 3 comments

You probably haven't linked react-native-svg correctly. And after doing so you must install the app again ( react-native run-{ios|android} )

i am having same issue. and it does not solve even after linking react-native-svg. I initially created the project in expo. where it was working fine, but when i ejected expo and ran project with react-native run-android it started giving this error.

why we need expo? how to solve that issue? I tried link but it's not working

Was this page helpful?
0 / 5 - 0 ratings