Question

可以显示条纹线而不是纯色吗？

例如：

Answer 1

我认为flot在这里错过了一个允许用户指定生成填充而不仅仅是颜色或渐变的函数的机会。我对代码here做了一个简单的修改并创建了一个拉取请求（flot github看起来已经放弃了，所以我不确定他们是否有人接受请求）。

通过此更改，您可以＆＃34;剥离＆＃34;像这样的酒吧：

＆＃13;

<!DOCTYPE html>
<html>

<head>
  <script data-require="jquery@3.0.0" data-semver="3.0.0" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.js"></script>
  <script data-require="flot@0.8.2" data-semver="0.8.2" src="https://rawgit.com/larsenmtl/flot/master/jquery.flot.js"></script>
</head>

<body>
  <canvas id="pattern" width="20" height="20" style="display:none"></canvas>
  <div id="placeholder" style="width:600px;height:300px;"></div>
  <script>
    $(function() {
      
      var p_can = $('#pattern').get(0),
        p_ctx = p_can.getContext('2d');
      p_ctx.beginPath();
      p_ctx.moveTo(0,0);
      p_ctx.lineTo(20,20);
      p_ctx.stroke();

      var d1 = [
        [0, 1],
        [2, 8],
        [4, 5]
      ];

      $.plot($("#placeholder"), [{
        data: d1,
        bars: {
          show: true,
          fill: function(a,b) {
            var ctx = $('#placeholder>canvas').get(0).getContext('2d');
            return ctx.createPattern(p_can, 'repeat');
          }
        }
      }], { });

    });
  </script>
</body>

</html>

＆＃13;

在这里，我创建了一个额外的画布元素，绘制了45度线，然后使用它来为条形创建填充图案。

FlotCharts：条纹线条

1 个答案: