chart-react-native v1.0.1

Charts React Native (chart-react-native)

This is a package for implementing charts on components easily with functionality.

Installation

Use the package manager npm to install rating-react-native.

npm install chart-react-native --save

react-native link

Usage

1. Vertical Bar Chart

import React, { Component } from 'react'
import { StyleSheet, View } from 'react-native'
import { VerticalBarChart } from 'chart-react-native'

export default class App extends Component {
  render() {
    const data = [
      {
        label: 'A',
        length: 20,
      },
      {
        label: 'B',
        length: 100,
      },
      {
        label: 'C',
        length: 80,
      },
      {
        label: 'D',
        length: 30,
      },
      {
        label: 'E',
        length: 50,
      }
    ]
    return (
      <View style={styles.container}>
        <VerticalBarChart data={data} style={{ width: 200, height: 300, backgroundColor: '#eeeeee', borderBottomWidth: 1, borderColor: "#bdbdbd" }} />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#eeeeee',
  },
})

Props of Vertical Bar Chart

2. Horizontal Bar Chart

import React, { Component } from 'react'
import { StyleSheet, View } from 'react-native'
import { HorizontalBarChart } from 'chart-react-native'

export default class App extends Component {
  render() {
    const data = [
      {
        label: 'A',
        length: 20,
      },
      {
        label: 'B',
        length: 100,
      },
      {
        label: 'C',
        length: 80,
      },
      {
        label: 'D',
        length: 30,
      },
      {
        label: 'E',
        length: 50,
      }
    ]
    return (
      <View style={styles.container}>
        <HorizontalBarChart data={data} style={{ width: 200, height: 300, backgroundColor: '#eeeeee', borderBottomWidth: 1, borderColor: "#bdbdbd" }} />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#eeeeee',
  },
})

Props of Horizontal Bar Chart

License

MIT