uniapp 画布图片居中

要让画布中的图片居中，可以先获取画布的宽度和高度，然后获取图片的宽度和高度，计算出图片应该居中的位置，再将图片绘制在该位置即可。以下是示例代码：

<template>
  <canvas canvas-id="myCanvas"></canvas>
</template>

<script>
export default {
  mounted() {
    const ctx = uni.createCanvasContext('myCanvas', this);
    const canvasWidth = uni.upx2px(300);
    const canvasHeight = uni.upx2px(200);
    const imgSrc = '/static/logo.png';
    const imgWidth = uni.upx2px(100);
    const imgHeight = uni.upx2px(100);
    const imgX = (canvasWidth - imgWidth) / 2;
    const imgY = (canvasHeight - imgHeight) / 2;
    
    ctx.drawImage(imgSrc, imgX, imgY, imgWidth, imgHeight);
    ctx.draw();
  }
}
</script>

在上面的示例代码中，我们使用了uni.createCanvasContext()方法获取了画布的上下文对象，然后定义了画布的宽度和高度，以及图片的宽度和高度。接着，我们计算出了图片应该居中的位置，并将图片绘制在该位置。最后，我们调用了ctx.draw()方法将画布渲染出来。