2

为多个列表反应原生 svg 条形图；我怎样才能像这张图片那样分开 2 条？ 条形图

现在的进展

我怎样才能做到这一点？

到目前为止的代码： -

到目前为止我的代码：

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/>
) } }
4

1 回答 1

2

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

于 2019-11-15T21:29:08.610 回答