XYチャート、リアクションネイティブを作成

Question

リアクションネイティブで基本的なxyチャートを作成するにはどうすればよいですか？たとえば、データがあります。

chart_data = [ 
[0,0],[0,1],[1,1],[1,0],[0,0] 
] 

これは正方形のポイントです。ほとんどの図書館では線図を作成し、他の線種グラフを作成します。助けてください

Answer 1

MPAndroidChartを試してみてください、さらにreact native wrapper for itがあります。

Answer 2

Canvasとそのメソッドを使用できます。反応するネイティブ・チャートは、AndroidとiOSの両方をサポートしているのに対しMPAndroidChartは、唯一のAndroidをサポートしていることがありますが

Answer 3

使用react-native-chart ...

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

const styles = StyleSheet.create({ 
    container: { 
     flex: 1, 
     justifyContent: 'center', 
     alignItems: 'center', 
     backgroundColor: 'white', 
    }, 
    chart: { 
     width: 200, 
     height: 200, 
    }, 
}); 

const data = [ 
    [0, 1], 
    [1, 3], 
    [3, 7], 
    [4, 9], 
]; 

class SimpleChart extends Component { 
    render() { 
     return (
      <View style={styles.container}> 
       <Chart 
        style={styles.chart} 
        data={data} 
        verticalGridStep={5} 
        type="line" 
       /> 
      </View> 
     ); 
    } 
} 

をポイントラインや図形を描くことができます。

例チャート：