uni-app 双三次插值

在 uni-app 中，可以使用 canvas 组件来进行图像的双三次插值。具体步骤如下：

1. 在页面中添加 canvas 组件，并设置其宽高与要显示的图像大小一致。

<canvas id="canvas" style="width: 500px; height: 500px;"></canvas>

2. 获取 canvas 的 context 对象，并使用 drawImage() 方法将原始图像绘制到 canvas 上。

const canvas = uni.createSelectorQuery().select('#canvas')
const ctx = canvas.getContext('2d')
const img = uni.createImage()
img.src = 'original.jpg'
img.onload = function () {
  ctx.drawImage(img, 0, 0, img.width, img.height, 0, 0, canvas.width, canvas.height)
}

3. 使用 drawImage() 方法对 canvas 中的图像进行缩放，并指定插值算法为双三次插值。

const scaledCanvas = uni.createCanvasContext('scaled-canvas')
scaledCanvas.drawImage(canvas, 0, 0, canvas.width, canvas.height, 0, 0, canvas.width * 2, canvas.height * 2)

需要注意的是，uni-app 中使用的 canvas 组件与原生的 canvas 对象略有不同，因此需要使用 uni.createCanvasContext() 方法来获取 context 对象。同时，需要在绘制缩放后的图像前创建一个新的 canvas 对象。

另外，需要注意的是，在 uni-app 中进行双三次插值的性能可能会受到设备的影响，因此建议在实际应用中进行性能测试并根据具体情况进行选择。