实现canvas中的文本水平居中、垂直居中

环境：uniapp项目

一、view视图

<canvas style="width: 400px; height: 40px;" canvas-id="myCanvas" id="myCanvas"></canvas>

二、js代码

  onReady(e) {
    var ctx = uni.createCanvasContext('myCanvas')
    ctx.font="16px Arial";
    ctx.textAlign = "center"
    ctx.textBaseline = "middle"
    ctx.fillText("北京上城11栋4层公共区域设备",200,20);
    ctx.draw()
  }

fillText(text, x, y) - 在 canvas 上绘制实心的文本

水平居中：设置 ctx.textAlign = "center"；x = 画布宽度的一半。

垂直居中：设置 ctx.textBaseline = "middle"；y = 画布高度的一半。

记录于2022-01-10。