Question

我正在尝试在React Native的同一线图中绘制02数据。我正在为此目的使用react-native-active-chart。尽管无法在同一图中绘制02数据，但我可以使用该库绘制01数据。谁能帮我吗？

 export default class Tela02 extends Component {

render() {
    const data = [ 50, 10, 40, 95, -4, -24, 85, 91, 35, 53, -53, 24, 50, -20, -80 ]
    const labels = ['10/01', '11/01', '12/01', '13/01' , '14/01' , '15/01', '16/01', '17/01', '18/01', '19/01', 
    '20/01', '21/01', '22/01','23/01', '24/01']
    const config = {
        line: {
            strokeWidth: 1, 
            strokeColor: '#216D99'
        },
        area: {
            visible: false,
        },
        yAxis: {
            labelColor: '#54a0ff'
        },
        xAxis: {
            visible: true,
            labelColor: '#54a0ff',
        },
        grid: {
            strokeColor: '#c8d6e5',
            stepSize: 30
        },
        insetY: 10, 
        insetX: 10,
        backgroundColor: '#fff'

    }

    return(
        <View>
            <View>
                <Text>{this.props.item.name}</Text>             
                <Text>{this.props.item.email}</Text>
            </View>
            <LineChart style={{height: 500}} config={config} data={data} xLabels={labels}/>

        </View>
    )
}

}

Answer 1

您正在使用什么组件？我在应用程序中使用了VictoryLine在同一张图中绘制了03个数据。检查链接中的示例-> https://formidable.com/open-source/victory/docs/victory-line

这也是我的代码的一个示例：

        <VictoryLegend x={legendWidht} y={legendHeight}
          orientation='horizontal'
          gutter={10}
          style={{ border:{ stroke:"black"}, title: {fontSize: 20} } }
          data={[
             {name: this.props.item.x, symbol:{fill:'blue'}},
             {name: this.props.item.y, symbol:{fill:'green'}},
             {name: this.props.item.z, symbol:{fill:'red'}}
             ]}
        />

您的数据必须采用->

格式

{ “ dataX”：[{“ x”：1549343469000，“ y”：0.952728}，{“ x”：1549343635000，“ y”：0.230757}]， “ dataY”：[{“ x”：1549343469000，“ y”：0.857968}，{“ x”：1549343635000，“ y”：0.326508}]， “ dataZ”：[{“ x”：1549343469000，“ y”：1.28743}，{“ x”：1549343635000，“ y”：0.27925}]， };

如何在React-Native的折线图中绘制2个数据

1 个答案: