chart.js 图表上的偏移叠加线

Question

我正在使用 Quince (leighquince/Chart.js) 的 Chart.js fork，想知道是否有任何方法可以偏移折线图的点，就像我在前两个点上说明的那样：

我想我需要第二个 x 轴。

Answer 1

只需交换 Overlay 图表类型的绘制函数来添加偏移量，就像这样

   Chart.types.Overlay.extend({
     // Passing in a name registers this chart in the Chart namespace in the same way
     name: "OverlayAlt",
     draw: function(ease) { 
       // most of this is from Quince's draw function
       var easingDecimal = ease || 1; 
       this.clear(); 
       this.scale.draw(easingDecimal); 
       Chart.types.Bar.prototype.drawDatasets.call(this, this.barDatasets, easingDecimal); 

       // here we just swap out the calculateX function after we draw the scale
       var originalScaleDraw =  this.scale.draw;
       var originalCalculateX = this.scale.calculateX;
       var scale = this.scale;
       var offset = (scale.calculateX(2) - scale.calculateX(1)) / 2;
       scale.draw = function() {
         originalScaleDraw.apply(this, arguments);
         scale.calculateX = function() {
           return originalCalculateX.apply(this, arguments) + offset;
         }
       }
       Chart.types.Line.prototype.drawDatasets.call(this, this.lineDatasets, easingDecimal); 
       this.scale.draw = originalScaleDraw;
       this.scale.calculateX = originalCalculateX;
     },
   });

---

小提琴（您评论中的更新版本）-http://fiddle.jshell.net/4tk3aa9e/