Installation Steps are incomplete?

Abhishek9634 commented 4 years ago

Why there is no doc for installation also example project is not running no ios/android folder is present.

Abhishek9634 commented 4 years ago

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 *
 * @format
 * @flow
 */

import React, { Component } from "react";
import { Platform, StyleSheet, Text, View } from "react-native";
import {
  LineChart,
  BarChart,
  PieChart,
  ProgressChart,
  ContributionGraph,
  StackedBarChart
} from "react-native-chart-kit";

import { Dimensions } from "react-native";
const screenWidth = Dimensions.get("window").width;

export default class App extends Component {
  render() {
    const data = {
      labels: ["January", "February", "March", "April", "May", "June"],
      datasets: [
        {
          data: [20, 45, 28, 80, 99, 43],
          color: (opacity = 1) => `rgba(134, 65, 244, ${opacity})`, // optional
          strokeWidth: 2 // optional
        }
      ]
    };

    const chartConfig = {
      backgroundGradientFrom: "#1E2923",
      backgroundGradientFromOpacity: 0,
      backgroundGradientTo: "#08130D",
      backgroundGradientToOpacity: 0.5,
      color: (opacity = 1) => `rgba(26, 255, 146, ${opacity})`,
      strokeWidth: 2, // optional, default 3
      barPercentage: 0.5
    };

    return (
      <View
        style={{
          flex: 1
        }}
      >
        <LineChart
          data={data}
          width={screenWidth}
          height={220}
          chartConfig={chartConfig}
        />

        <LineChart
          data="{data}"
          width="{screenWidth}"
          height="{256}"
          verticalLabelRotation="{30}"
          chartConfig="{chartConfig}"
          bezier
        />
      </View>
    );
  }
}

THIS CODE GIVES BLANK SCREEN

Abhishek9634 commented 4 years ago

{
  "name": "ChartDemo",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "react": "16.8.3",
    "react-native": "0.59.8",
    "react-native-chart-kit": "^3.10.0",
    "react-native-svg": "^9.12.0"
  },
  "devDependencies": {
    "@babel/core": "^7.6.4",
    "@babel/runtime": "^7.6.3",
    "babel-jest": "^24.9.0",
    "jest": "^24.9.0",
    "metro-react-native-babel-preset": "^0.56.0",
    "react-test-renderer": "16.8.3"
  },
  "jest": {
    "preset": "react-native"
  }
}

PACKAGE.JSON

vitorverasm commented 4 years ago

Hi @Abhishek9634 there is docs for installation you can find them here, but I agree that they are not very separated in the README, like a Getting started section.

About the example project, indeed it don't have android/ios folders, and that's because it's builded with expo and not with the raw react-native cli.

About the sample code you put there, it gives me an error because of this piece:

<LineChart
  data="{data}"
  width="{screenWidth}"
  height="{256}"
  verticalLabelRotation="{30}"
  chartConfig="{chartConfig}"
  bezier
/>

It's because of the double quotes of the example, you should remove them.

indiespirit / react-native-chart-kit

Installation Steps are incomplete? #197