Stack Overflow
Stack Overflow

Questions tagged [react-native-chart-kit]

73 questions
2
votes
1 answer

In React native with library react-native-chart-kit fonts are not working

using the library react-native-chart-kit but fonts not working with this library code below used for line chart using fontFamily "Montserrat-Regular"
deepanshu katyal
  • 631
  • 1
  • 8
  • 18
2
votes
1 answer

Rainbow-me React Native chart not showing Path

I am using @rainbow-me/animated-charts to make simple charts but the line path seems to be missing. I copied the code below from their NPM github but it only shows a black box (i'm assuming its just the background of the chart) but the main line…
Nathan Belete
  • 21
  • 1
2
votes
0 answers

How can I make this with react-native-chart-kit

can any one help me with this. I want to create a graph similar to the one in this Picture. I have searched alot and came across this awsome library react-native-chart-kit. It is easy to make bar chart like this with this library but as you can see…
hamzaahzam
  • 306
  • 3
  • 14
2
votes
1 answer

Positioning icon in SVG in React Native

Background: I am trying to add a tooltip to a react-native-svg chart following this tutorial. The link to the tutorial: Link Current Code Implementation: import React, {useState} from 'react'; import {View, Text, Dimensions} from…
Blake
  • 157
  • 4
  • 13
2
votes
1 answer

modify label's width in react-native-chart-kit

Im drawing chart with my dynamic values and I need to know 2 things : 1/ modify the width of labels in x and y using the LineChart of react-native-chart-kit !! 2/ control the scale of my graph If you know a proporties or options that can make this…
imanealami
  • 189
  • 5
  • 13
2
votes
1 answer

How to change x-axis and y-axis position in BarChart (React Native)

I am new to React Native. I would like to know if we can change the position of X-Axis and Y-Axis into something like this (please refer to the picture I have attached below) As you can see from the above image, Manager is an x-axis while sales…
Jennie Kim
  • 43
  • 1
  • 8
2
votes
0 answers

getting error "requireNativeComponent: 'RNSVGLinearGradient' was not found in the UIManager..." while rendering Pie Chart using react-native-chart-kit

I have used react-native-chart-kit and react-native-svg in my project, initially I created my project in Expo, where it was working fine(the Pie Chart was rendering perfect with no issues) but when I ejected Expo, and ran project with react-native…
Anukool
  • 732
  • 1
  • 9
  • 21
2
votes
3 answers

Customizing Colors of React Native Chart Kit

A basic line/area chart has been created for a React Native app using the react-native-chart-kit package, as shown using the code below. Question: How can we change independently the style/color of the components of the plots? Such as the dots, line…
Nyxynyx
  • 61,411
  • 155
  • 482
  • 830
1
vote
1 answer

How can I remove certain strokes in the react-native-chart-kit graph?

I want to remove all the strokes from this graph except the bottom one. I've tried going through the react-native-svg documentation and through the react-native-chart-kit documentation but I can't seem to find anything about it. The…
DuckBio
  • 11
  • 2
1
vote
1 answer

How to give a padding in between x-axis labels in React-Native-Chart-Kit?

Is there a way to give a custom space/padding in between x-axis Labels in React-Native-Chart-Kit? Example if we have labels from Jan-Dec, x-axis labels in the chart gets very compact. And even if we give a custom space between x-axis Labels then how…
sasikaadesh
  • 11
  • 2
1
vote
0 answers

How to give border radius in Bar chart react native

I am trying to give space in chart and number and wants to make bar chat curve from top Like there in number coming on top of chart I have to give space on that and make the chart curve from top. Please suggest , Thanks
abhigyan kr
  • 125
  • 7
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

Invariant Violation: requireNativeComponent: "RNSVGLinearGradient" was not found in the UIManager

I am trying to be able to use react-native-chart-kit. I installed react-native-chart-kit and react-native-svg by npm. react-native : "0.69.5" After running the following command: npx react-native run-android npx react-native start
Raana Tashakori
  • 407
  • 1
  • 6
  • 18
1
vote
0 answers

React Native Charts crashes in Release in Android

I have a problem when using react-native-chart-kit in my application. I am using expo-cli and in development mode, my charts work very well. When I generate a release using eas build cli from expo and do an internal test, the app crashes or doesn't…
Arsid Mithi
  • 11
  • 1
1
vote
0 answers

Can I wrap the legends or put the legends below the pie in react-native-chart-kit Pie Chart?

In my react-native-chart-kit pie chart, there will always be either absolutely no data (which I won't show the pie chart at all) or there are exactly two pieces of data. By default, the legends are showing to the right of the pie. The actual text…
Monte Chan
  • 1,193
  • 4
  • 20
  • 42
1
2
3 4 5