我正在创建一个音频波形，它应该如下所示：
请注意缐的角点是如何根据方向弯曲的。
我的波形当前只有直线：
如何才能达到预期的效果？
我的当前波形代码为：
fileprivate func createPath(with points: [CGPoint], pointCount: Int, in rect: CGRect) -> CGPath {
let path = UIBezierPath()
guard pointCount > 0 else {
return path.cgPath
}
guard rect.height > 0, rect.width > 0 else {
return path.cgPath
}
path.move(to: CGPoint(x: 0, y: 0))
let minValue = 1 / (rect.height / 2)
for index in 0..<(pointCount / 2) {
var point = points[index * 2]
path.move(to: point)
point.y = max(point.y, minValue)
point.y = -point.y
path.addLine(to: point)
}
let scaleX = (rect.width - 1) / CGFloat(pointCount - 1)
let halfHeight = rect.height / 2
let scaleY = halfHeight
var transform = CGAffineTransform(scaleX: scaleX, y: scaleY)
transform.ty = halfHeight
path.apply(transform)
return path.cgPath
}
1条答案
按热度按时间gijlo24d1#
有两种方法可以完成此操作：
1.与其将每个条形视为一条宽线，不如将其填充为一个形状，每个形状都有自己的左、上、右和下四个部分，而上部分则是贝塞尔曲线。
1.您可以使所有条形从最小值变为最大值，然后在整个图形上添加遮罩以渲染平滑形状，而不是调整每个条形的顶部。
例如，这显示了几个数据点，覆盖Catmull Rom贝塞尔曲线，然后我扩展了酒吧（因为有时贝塞尔曲线会超过现有的酒吧），然后使用贝塞尔曲线作为遮罩，而不是覆盖。
其他观察结果：
1.请注意，您的第一张图像的线条顶部是弧形的，这张图像还有另一个使其看起来平滑的特征：数据点本身是平滑的，你的第二张图的波动性比第一张大得多。
波动性的来源（常见于音轨或几乎任何DSP数据集）或缺乏波动性在这里并不重要。重要的是，如果数据样本变化很大，曲线条顶部的插值算法实际上会夸大波动性。单点峰值会异常尖锐。双点峰值实际上会比实际更高。
例如，考虑以下数据集：
对于这种可变性，可以认为条形的“四舍五入”使结果更难阅读和/或具有误导性：
1.虽然我试图回答这个问题，但人们必须问，这整个过程是否谨慎。虽然将曲线绘制到条形图顶部可能具有美学吸引力，但它表明的连续性/精确度高于基础数据可能支持的程度。方形条形图更准确地表示聚合数据的值范围的现实情况，因此，是常见的视觉表示。