如何在c3.js中获得分组条形图（堆栈图表）的圆角

Question

请帮我在c3.js中为堆积图表（分组条形图）添加圆角。

我在这里找到了类似的东西How to get rounded columns in c3.js bar chart  但这是正常的条形图。 它不适用于堆积图表。 我不熟悉d3.js. 谢谢:)）

这是我的代码。

    var chart = c3.generate({
        bindto: "#id",//element
        padding: {
            left: 50,
            right: 50,
            top: 20,
            bottom: 20
        },
        data: {
            // x : 'x',
            columns: [//Data Arry
                ['data1', 30, 200, 200, 400, 150, 250, 30, 200, 200, 400, 150, 250, 0, 100, 100, 200, 150, 400, 400, 400, 400, 400, 400, 400],
                ['data2', 30, 200, 200, 400, 150, 250, 30, 200, 200, 400, 150, 250, 0, 100, 100, 200, 150, 400, 400, 400, 400, 400, 400, 400],
                ['data3', 30, 200, 200, 400, 150, 250, 30, 200, 200, 400, 150, 250, 0, 100, 100, 200, 150, 400, 400, 400, 400, 400, 400, 400],

            ],
            type: 'bar',
            groups: [
                ['data1', 'data2', 'data3']//grouping data to get stacked chart
            ],

        },
        bar: {
            width: {
                ratio: .6 //setting width of bar
            },
            spacing: 2//setting space between bars
        },

        grid: {
            y: {//grid lines
                show: true,
                color:'red'
            }
        },


        axis: {

            x: {
                type: 'category',
                tick: {
                    rotate: -90,
                    multiline: false,
                    format: "%b"                   //format: "%e %b %y"
                },

                height: 50,
                categories: ['2016', '2017', '2016', '2017', '2016', '2017', '2016', '2017', '2016', '2017', '2016', '2017', '2016', '2017', '2016', '2017', '2016', '2017', '2016', '2017', '2016', '2017', '2016', '2017'] //Xaxis labels
            },
            y2: {
                show: false
            },
            y: {
                tick: {
                    format: d3.format("s")//format y axis
                }
            }

        },
        color: {
            pattern: ['#fc7f86', '#34dfe2', '#dc92fa', '#43daa1'] //color code
        }
    });

Answer 1

将数据顺序设置为空

 data: {

                columns: [
                    ['data1', 30, 200, 200, 400, 150, 250, 30, 200, 200, 400, 150, 250, 0, 100, 100, ],
                    ['data2', 30, 200, 200, 400, 150, 250, 30, 200, 200, 400, 150, 250, 0, 100, 100, ],
                    ['data3', 30, 200, 200, 400, 150, 250, 30, 200, 200, 400, 150, 250, 0, 100, 100, ],

                ],
                type: 'bar',
                groups: [
                    ['data1', 'data2', 'data3']
                ],
                order: null

            },