我试着让高图表的顶部边框以这样的方式在里面弯曲

在像下面这样的圆柱上。我试着玩
borderRadius 在css中,没有什么对我有效,我得到的收尾是这样的,这不是一种选择。

小提琴手来这里是为了赛林德
还有这里的专栏。对于我的用例来说,两者都很好。https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/column-borderradius/
发布于 2019-07-04 18:06:00
这是不可能的,通过使用defualt,但有可能添加一个扩展包装原型函数。您可以包装drawPoints方法,将列形状类型从rect更改为具有弯曲顶部边框的path。
(function(H) {
H.wrap(H.seriesTypes.column.prototype, 'drawPoints', function(proceed) {
this.points.forEach(function(point) {
var sArgs = point.shapeArgs;
point.shapeType = 'path';
point.shapeArgs = {
'd': [
'M', sArgs.x, sArgs.y,
'Q', sArgs.x + sArgs.width / 2,
sArgs.y + sArgs.width / 2,
sArgs.x + sArgs.width, sArgs.y,
'L', sArgs.x + sArgs.width, sArgs.y + sArgs.height,
sArgs.x, sArgs.y + sArgs.height, 'z'
]
}
});
proceed.apply(this, Array.prototype.slice.call(arguments, 1));
});
}(Highcharts));现场演示: http://jsfiddle.net/BlackLabel/as6y1uhn/
API参考: https://api.highcharts.com/class-reference/Highcharts#.wrap
https://stackoverflow.com/questions/56869272
复制相似问题