Question

使用c3＆＃39; area-step＆＃39; （或＆＃39; step＆＃39;）类型和x轴类型，阶梯值在x轴外向左和向右延伸; 它适用于＆＃39;区域＆＃39;类型或数字轴;

理想情况下，我希望步进值停在x轴的极限。

＆＃13;

var centile-chart = c3.generate({
                bindto: '#centile-chart',                
                axis: { x: {  
                        label: {
                            text: 'Centile Band',
                            position: 'outer-center'
                            },
                        type: 'category'
                     } ,
                     y: {
                        label: {text: '% of reports',
                        position: 'outer-middle'},
                        tick:{
                            format: d3.format('%')
                        }
                    }},
                data: { 
                    x: 'Centile Band',
                    columns:  [
                        ['Centile Band', '1%', '5%', '10%', '25%', '50%' ],
                        ['% (cumulative)', 0.05, 0.16, 0.26, 0.48, 0.76],
                        ['National Average % (cumulative)', 0.04, 0.15, 0.25, 0.47, 0.74],
                        ['Centile', 0.01, 0.05, 0.1, 0.25, 0.5]
                        ],
                    type:'bar',
                    types : {
                       'Centile' : 'area-step'
                    },
                    colors : {
                        'Centile': '#0000ff'
                    }
                },
                size: {
                    width: 940
                },
                bar: {
                    width: {
                        ratio: 0.5
                    }
                },
                legend: {
                    position: 'right'
                }
            });

＆＃13;

Answer 1

不知何故，您正在删除通常位于.c3-chart元素上的clip-path属性

当我用你的代码运行这个小提琴时，步进图表在图表范围内

http://jsfiddle.net/wn3vzn0k/1280/

然后我添加了超时我删除剪辑路径和宾果游戏，它看起来像你的图像

setTimeout(function () {
    d3.select("#centile-chart").select(".c3-chart").attr("clip-path", null);
}, 3000);

您需要深入挖掘一下，看看为什么您的剪辑路径正在消失，因为您发布的代码中没有任何内容可以消失。

c3区域步骤突出外轴

1 个答案: