有没有办法使用 Chart.JS 2.0 创建垂直线(事件线、相变)?
我在网上看到了一些示例(请参阅此相关问题),但是,当使用 Moment.js 创建水平轴时,不可能给 LineAtIndex 一个 moment.js 日期以在该日期创建一条线。
var originalLineDraw = Chart.controllers.line.prototype.draw;
Chart.helpers.extend(Chart.controllers.line.prototype, {
draw: function() {
originalLineDraw.apply(this, arguments);
var chart = this.chart;
var ctx = chart.chart.ctx;
var index = chart.config.data.lineAtIndex;
if (index) {
var xaxis = chart.scales['x-axis-0'];
var yaxis = chart.scales['y-axis-0'];
ctx.save();
ctx.beginPath();
ctx.moveTo(xaxis.getPixelForValue(undefined, index), yaxis.top);
ctx.strokeStyle = '#ff0000';
ctx.lineTo(xaxis.getPixelForValue(undefined, index), yaxis.bottom);
ctx.stroke();
ctx.restore();
}
}
});
这是一个演示问题的小提琴: https ://jsfiddle.net/harblz/0am8vehg/
我相信我的问题是我没有正确理解这段代码:
var xaxis = chart.scales['x-axis-0'];
var yaxis = chart.scales['y-axis-0'];
如果我能够弄清楚这一点,我将在这里为任何处理同一项目的未来用户发布一个工作小提琴。
感谢您花时间阅读本文:)