假设你是一个JS的前端程序员，现在在canvas上一个已知XY坐标和方向th的点，你需要绘制一个长方形方块，长方形的长宽分别为20和10，，长方形的方向与点的th方向一致，你能给出一个函数输入点的信息然后绘制出来吗

可以，可以使用canvas的API来实现。以下是一个绘制长方形的函数，可以传入参数：canvas的上下文对象ctx、点的坐标x、y和方向th：

function drawRectangle(ctx, x, y, th) {
  ctx.save(); // 保存当前画布状态
  ctx.translate(x, y); // 平移画布，使点的坐标为原点
  ctx.rotate(th); // 旋转画布，使方向与点的方向一致
  ctx.fillRect(-10, -5, 20, 10); // 绘制长方形
  ctx.restore(); // 恢复画布状态
}

其中，translate函数可以平移坐标系，rotate函数可以旋转坐标系，fillRect函数可以绘制长方形。使用save和restore函数可以保存和恢复画布状态，避免对后续绘制产生影响。