使用html2canvas插件截图区域从屏幕左上角开始？

Question

1、采用html2canvas插件截图，利用自定义canvas时，因所需截取区域位于视图中央，但每次结果都是从屏幕左上角开始的

2、代码如下：

var createImage = function(targetEle) {
    var shareContent = targetEle;
    var width = shareContent.offsetWidth;
    var height = shareContent.offsetHeight;
    var canvas = document.createElement("canvas");
    var scale = 1;

    canvas.width = width * scale;
    canvas.height = height * scale;
    canvas.getContext("2d").scale(scale, scale);

    var opts = {
      scale: scale,
      canvas: canvas,
      logging: true,
      width: width,
      height: height
    };

    html2canvas(shareContent, opts).then(function(canvas) {
      var context = canvas.getContext('2d');

      var img = Canvas2Image.convertToImage(canvas, canvas.width, canvas.height);

      document.body.appendChild(img);
      $(img).css({
        "width": canvas.width / 2 + "px",
        "height": canvas.height / 2 + "px",
      })
    });
  }
  

3、视图
1）所需截取区域：

2）所得结果区域：

4、所尝试的办法
1）不采用自定义canvas可以，但是无法自定义画布，因此出来的图像模糊，无法解决scale:2 的问题
2）给视图设定样式为 margin:0 auto; 无效，仍是如此
3) 加上视图的偏移距离无效，偏移距离部分变为黑色

5、期望
希望能够准确得到所需截取区域的视图并能保证视图的清晰度

Answer 1

可以控制属性x和y来办到的

Answer 2

我解决啦
啦啦啦啦

Answer 3

var createImage = function(targetEle) {
    var shareContent = targetEle;
    var width = shareContent.offsetWidth;
    var height = shareContent.offsetHeight;
    var canvas = document.createElement("canvas");
    var scale = 1;

    canvas.width = width * scale;
    canvas.height = height * scale;
    canvas.getContext("2d").scale(scale, scale);
    
    //修改偏移量
    canvasDom=canvas.getContext("2d")
    canvasDom.translate(('-'+(shareContent.offsetLeft),'-'+(shareContent.offsetTop))

    var opts = {
      scale: scale,
      canvas: canvas,
      logging: true,
      width: width,
      height: height
    };

    html2canvas(shareContent, opts).then(function(canvas) {
      var context = canvas.getContext('2d');

      var img = Canvas2Image.convertToImage(canvas, canvas.width, canvas.height);

      document.body.appendChild(img);
      $(img).css({
        "width": canvas.width / 2 + "px",
        "height": canvas.height / 2 + "px",
      })
    });
  }