如何使用ART和D3在React Native的条形图中使用LinearGradient?

时间:2019-04-11 19:50:58

标签: react-native d3.js charts

我已通过回答StackOverflow问题ART and d3 barchart in react native给出的示例,使用ART在React Native中创建了BarChart。 我试图在从上到下的所有栏中添加线性渐变,但是失败了。

我通过查看GitHub文档https://github.com/react-native-china/react-native-ART-doc/blob/master/doc.md#lineargradient进行了尝试。 但是它会在所有条形中填充蓝色而没有渐变(根据文档,它只能在1%的位置填充蓝色)

    const linearGrad = new LinearGradient({
        '.1': 'blue', // blue in 1% position
        '1': 'rgba(255, 255, 255, 0)' 
        },
        "0", "0", "0", "400"
    )


    // In Bar Shape
    <Shape
        d={this.createBarChart(x(d.letter), y(d.frequency) - height, x.bandwidth(), height - y(d.frequency))}
        fill={linearGrad} 
    >
    </Shape>

我可能会混淆在文档中指定为(0,0,0,400)的每个条形的(x1,y1)和(x2,y2)点。关于如何在此处实现渐变的任何想法。预先感谢。

0 个答案:

没有答案