Question

我正在使用chart.js 2.6.0，这是最新版本。

我正在尝试覆盖条形图以使圆角变圆。我找到了这个脚本：https://github.com/jedtrow/Chart.js-Rounded-Bar-Charts/blob/master/Chart.extentions.js并且效果很好。

我创建了一个新的图形选项：“is_curved”，因为我在同一页面上有多个图形，我只想为其中一些制作圆角。

我的问题是，如果我使用以下代码，所有图表都有圆角：

Chart.elements.Rectangle.prototype.draw = function() {
    //code to make corners rounded
}

功能：

Chart.elements.Rectangle.prototype.draw

在所有图表上调用。我希望只有当选项“is_curved”设置为true时才执行它。所以我试过了：

Chart.elements.Rectangle.prototype.draw = function() {
    if(!this._chart.options.is_curved) {
        return;
    }
    //code to make corners rounded
}

但这仍然是错误的，因为未将“is_curved”选项设置为true的图表为空，我想我调用.draw方法的事实会删除所有现有功能，即使我不知道为他们添加新功能。

任何想法如何设置绘图功能仅适用于“is_curved”选项设置为true的图表？感谢。

Answer 1

更改此行代码：

var cornerRadius = 5;

到此：

var cornerRadius = this._chart.options.is_curved ? 5 : 0;

如果 5 属性设置为

，则会将的角半径设置为 is_curved 任何特定图表的 true ，否则将设置为 0 。

请参阅 - working example on JSFiddle

Chart.js v2覆盖绘图功能

1 个答案: