javascript - Flot 刻度转子显示刻度两次

标签 javascript jquery flot

所以我用了 flot-tickrotor用于旋转图表 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);

最佳答案

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

div.xAxis div.tickLabel { display:none }

注意:请确保将其放入 HEAD 标签内的样式标签中或在添加流程图插件之前,以便可以覆盖默认样式

关于javascript - Flot 刻度转子显示刻度两次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20141952/

相关文章:

javascript - 如何在 Angular 中通过自定义指令添加 mattooltip

javascript - Protractor 找不到密码为 id 的 gmail 输入

javascript - 如何为 chrome 扩展制作粘性弹出窗口

jQuery Ajax 和使用 appcache 时的 Android 浏览器问题

javascript - 如何在 JavaScript 中不在元素上绑定(bind)点击监听器

javascript - float 日期条形图对齐歪斜

javascript - 如何使用 jQuery 在按钮单击时显示下一个 div?

javascript - 当我使用索引时,Slick Slider slickAdd 不起作用

php - 如何在 flot 中的两条线之间遮蔽区域?

javascript - jQuery Flot 库的类别插件不起作用