Flot tick转子显示蜱两次

时间:2013-11-22 09:59:01

标签: javascript jquery flot

所以我使用flot-tickrotor插件旋转我的flot图表的x轴上的刻度线,问题现在虽然是,但它显示了两次;

enter image description here

你知道为什么会这样吗?

这是我正在使用的代码,你会注意到我没有特别添加滴答声;

        //sample data
    var mainDataSet = {name:'1 - WOMENS OUTERWEAR',     Actual: 181.8,  Budget:15.7,  BudgetVar: 8.4 } ,
                        {name:'2 - WOMENS LINGERIE',      Actual: 12.5,   Budget:6.0,   BudgetVar: -1.3 } ,
                        {name:'3 - KIDSWEAR',             Actual: 8.7,    Budget:13.2,  BudgetVar:0.8 } ,
                        {name:'5 - MENSWEAR',             Actual: 4.9,    Budget:4.4,   BudgetVar: 0.5 } ,
                        {name:'6 - WOMEN FOOTWEAR+ACCES', Actual: 354.0,  Budget:16.5,  BudgetVar: 14.7 }
                      ];

    var graph_options = { 
        series: {
          lines: { show:false , fillColor:'#CDD0D1', fill:true},
          points: { show: false },
          color: '#3B80F7',
        },

        grid: {
          hoverable: true, 
          clickable: true, 
          show:true, 
          borderWidth: 0.5,
          backgroundColor: { colors: ["#FFF", "#CDD0D1"] }
        },
        xaxis: {
          mode: "categories",
          //tickLength: 1,
          rotateTicks: 45
        }
    };

    var barGraphData = []; //graph_settings
    var graph_settings = {label: dataSets[c].label, 
      data: mainDataSet, 
      bars: { show: true , align: "center", barWidth: 0.5},
      color: '#3B80F7'
    };

    barGraphData.push(graph_settings);

    var barGraph = $.plot($("#bar_graph_canvas"), barGraphData, graph_options);

1 个答案:

答案 0 :(得分:2)

好的,所以根据the issue log for flot charts这是自0.8.1以来flot的一个已知问题,解决方法是在你的样式中添加它,直到问题得到解决;

div.xAxis div.tickLabel { display:none }

注意:请确保在包含您的flot图表插件之前将其放入样式标记中,以便可以覆盖默认样式