Javascript 如何在Flot js上修复xaxis标签

Javascript 如何在Flot js上修复xaxis标签,javascript,jquery,html,canvas,flot,Javascript,Jquery,Html,Canvas,Flot,我正在使用“类别”模式显示标签。它适用于图形上的少量数据,但当我有超过100个数据时,就无法看到标签。flot js有什么解决方案吗 包含更多数据的图表如下所示: 下面是我用来显示图表的选项: var stackOptionSeries = { stack: true, bars: { show: true, barWidth: 0.4, align: 'center',lineWidth: 1.5, fillColor: { colors: [ { opacity: 0.9 }, {

我正在使用“类别”模式显示标签。它适用于图形上的少量数据,但当我有超过100个数据时,就无法看到标签。flot js有什么解决方案吗

包含更多数据的图表如下所示:

下面是我用来显示图表的选项:

var stackOptionSeries = { stack: true, bars:  { show: true,  barWidth: 0.4, align: 'center',lineWidth: 1.5, fillColor: { colors: [ { opacity: 0.9 }, { opacity: 0.8 } ] }  } };

    var options = {
    grid:{ hoverable: true,
           clickable: true,
           autoHighlight:true,
           backgroundColor: 'white',
           borderWidth:1,
           borderColor:"rgba(0,0,0,0.1)",
           tickColor:'#FAFAFA'},
    series: stackOptionSeries,
    legend: {
      show: true,
      position: "ne",
      noColumns: 1
    },
    xaxis: {
      mode: "categories",
      tickLength: 0,
      panRange: [-0.2, maxXaxisRange+0.2]
    },
    yaxes:  [{ min: 0,ticks:7, panRange: [0,null], zoomRange: false }, {
      position: "right",
      autoscaleMargin: 1,
      ticks:4,
      min: 0,
      max: 100,
      panRange: [0,null],
      zoomRange: false
    }],
    pan: {
        interactive: true,
        frameRate: 80
    },
    tooltip: true,
    tooltipOpts: {
      content: "%y %s, %x", // show percentages, rounding to 2 decimal places
      shifts: {
        x: 10,
        y: 10
      },
      defaultTheme: false
    } 
  };
嗨 使用有角度的标签怎么样?然后,标签不应该显示在彼此的顶部

 xaxis: {
            labelAngle: 45}


希望对您有所帮助

类别模式的唯一用途是允许使用文本标签。如果您不打算显示标签,那么为什么要使用它?在您的例子中,x轴值似乎与日期对应,为什么不使用时间模式轴呢?