Jqplot:为什么0条渲染?

时间:2017-03-21 18:25:59

标签: javascript jquery jqplot

我遇到了jqplot的问题,其中堆叠条有时会显示0的条形。我不想要条形码0.与每个条形相关联的所有数字加起来最大。这就是我所看到的。

Stacked bars with 0 labels removed

问题在于MS / AL(27站)。有一个蓝色条,但该条代表0.但这并不总是发生。实际上可以在条形图中显示第三种颜色,但这个例子都没有显示它。

这是一个示例,点标签显示0(而不是hideZeros:true)只是为了证明0导致条形图呈现。

Stacked bars with labels for 0s

这是我的javascript:

$.jqplot(div_id, customer_amount, {
                            title:{
                                text: v.truck_label+' ('+v.count+' stops)',
                                textAlign: 'left'
                            },
                            animate: true,
                            stackSeries: true,
                            axesDefaults:{
                                showTicks: false,
                                tickOptions:{
                                    show: false,
                                    showTicks: false,
                                    showGridline: false
                                },
                                rendererOptions: {
                                    baselineWidth: 1.5,
                                    drawBaseline: false
                                }
                            },
                            seriesDefaults:{
                                renderer:$.jqplot.BarRenderer,
                                rendererOptions: {
                                    barDirection: 'horizontal',
                                    highlightMouseOver: false,
                                    //shadow: false
                                    shadowAngle: 35,
                                    shadowAlpha: 0.1,
                                    shadowDepth: 4
                                },
                                pointLabels: {
                                    show: true,
                                    formatString: '%d',
                                    hideZeros:true
                                }
                            },
                            axes: {
                                yaxis: {
                                    renderer: $.jqplot.CategoryAxisRenderer,
                                    showTicks: false,
                                    ticks: [''],
                                    tickOptions:{
                                        show: false,
                                        showGridline: false
                                    }
                                },
                                xaxis: {
                                    max: max,
                                    showTicks: false,
                                    tickOptions:{
                                        show: false,
                                        showGridline: false
                                    }
                                }
                            },
                            grid: {
                                drawGridLines: false,
                                drawBorder: false,
                                shadow: false,
                                borderColor: 'transparent',
                                background: 'transparent'
                            },
                            seriesColors: series_colors

});

有人知道发生了什么吗?有什么建议吗?

1 个答案:

答案 0 :(得分:0)

看到工作小提琴......

var options = {
        title: 'Title ',
        stackSeries: true,
        seriesColors: ["#eb4b3d", "#ffc800", "#009149"],
        seriesDefaults: {
            renderer: $.jqplot.BarRenderer,
            pointLabels: {
                show: true,
                hideZeros: true
            },
            rendererOptions: {
                barWidth: 25,
                varyBarColor: true,
            },
        },
        axes: {
            xaxis: {
                // renderer: $.jqplot.CategoryAxisRenderer,
                //  
                renderer: $.jqplot.CategoryAxisRenderer,
                ticks: ticks,
            },
            yaxis: {
                //autoscale: true,
                //label: 'Application Count',
                min: 0,
                tickInterval: 5,
                max: 50
            }
        },
        axesDefaults: {
            tickRenderer: $.jqplot.CanvasAxisTickRenderer,
            tickOptions: {
                angle: -30,
                fontSize: '10pt'
            }
        }
    };

http://jsfiddle.net/arzv5j6o/3/