多个列表的React原生svg条形图；如何将两个条形图分开

Question

多个列表的React原生svg条形图；我如何像这样将两个条形图分开？bar-chart

current progress

我如何才能做到这一点？

到目前为止的代码：

到目前为止我的代码如下：

import React, {Component} from 'react'
import { View, StyleSheet} from 'react-native'
import { BarChart, Grid } from 'react-native-svg-charts'

class SliderComponent extends Component{
render(){
 const data1 = [ 14, 8, 6, 13 ]
 .map((value) => ({ value }))
 const data2 = [ 9 , 7, 12, 10 ]
 .map((value) => ({ value }))

const barData = [
  {
  data: data1,
  svg: {
      fill: '#05E4B5',

  },
 },
 {
  data: data2,
  svg: {
    fill: '#7659FB',
},
},
  ]

return (
<BarChart
  style={ { height: 200 } }
  numberOfTicks={0}
  spacingInner={0.5}
  spacingOuter={0.2}
  data={ barData }
  yAccessor={({ item }) => item.value}
  contentInset={ { top: 20, bottom: 30 } }
  { ...this.props }
  >
  <Grid/>

      )      }     }

Answer 1

我找到了答案: svg：{ fill：'#05E4B5'，x：-2，}，