javascript - FLOT中的主要和次要壁虱

一些图表/绘图库，例如适用于Python的matplotlib具有主要和次要刻度线(以及相应的主要和次要网格线)的概念。我一直在环顾四周，我认为这在FLOT中并不存在。似乎只有一类价格变动。

不可能像下面这样做吗，如果是的话，怎么做？

例如，如下图所示，每1.0出现一次大刻度，而每0.2出现了次刻度。

最佳答案

您是对的，flot本身不支持此功能。

要复制您的图形，我将使用grid markings并在每个整数刻度处添加一条粗线:

   $.plot("#placeholder", [ d1 ], {
      xaxis: {
       tickSize: 0.2 // regular tick at 0.2
      },
      grid: {
       markings: function (axes) {
        var markings = [];
        var xTicks = axes.xaxis.ticks;
        for (var i = 0; i < xTicks.length; i++){ // loop all the ticks and add a black line at each whole number
          if (xTicks[i].v % 1 === 0){
            markings.push({ xaxis: { from: xTicks[i].v - 0.005, to: xTicks[i].v + 0.005 }, color: 'black' });
          }
        }
        return markings;
    }
  }
});

产生(例如here):