0

我正在尝试使用 jSignature 将签名板添加到 Google 表格。我添加了一个对话框,记录这样的签名:

//Code.gs
function showDialog() {
  var html = HtmlService.createHtmlOutputFromFile('Page')
    .setWidth(400)
    .setHeight(300);
DocumentApp.getUi()
  .showModalDialog(html, 'Your Signature is Required');
}

//Page.html
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/willowsystems/jSignature/master/libs/jSignature.min.js"></script>

Please draw your signature on the signature pad below: 

<div id="signature"></div>

<img id="rendered" src="">

<script>
  $("#signature").jSignature({
    'background-color': 'transparent',
    'decor-color': 'transparent'
  });

  function renderSignature(){
    $("img#rendered").attr("src",$('#signature').jSignature('getData','default'));
  }
</script>

<input type="button" value="Render" onclick="renderSignature();"/>
<input type="button" value="Add to Sheet" onclick="//What to do"/>
<input type="button" value="Close" onclick="google.script.host.close()" />

唯一的问题是我无法弄清楚如何将图像放入单元格中。复制/粘贴不起作用,据我所知,它需要插入。我在想也许我编写了一个函数将其保存到 Google Drive,然后使用 URL 将其插入,但我仍然不知道如何获取实际图像以便对其进行任何操作。任何见解表示赞赏,我是 GS 的新手。

4

1 回答 1

1

要将图像保存到您的云端硬盘,您可以执行以下操作

您的 HTML 代码:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/willowsystems/jSignature/master/libs/jSignature.min.js"></script>

Please draw your signature on the signature pad below: 

<div id="signature"></div>

<img id="rendered" src="">

<script>
  $("#signature").jSignature({
    'background-color': 'transparent',
    'decor-color': 'transparent'
  });

  function renderSignature(){
    $("img#rendered").attr("src",$('#signature').jSignature('getData','default'));
  }

  function saveImage(){ //This sends the image src to saveImages function
  var bytes = document.getElementById('rendered').src
  console.log(bytes)
  google.script.run.saveImage(bytes)
  }
</script>

<input type="button" value="Render" onclick="renderSignature();"/>
<input type="button" value="Add to Sheet" onclick="saveImage()"/>
<input type="button" value="Close" onclick="google.script.host.close()" />

服务器端代码:

function showDialog() {
  var html = HtmlService.createHtmlOutputFromFile('Sign')
    .setWidth(400)
    .setHeight(300);
SpreadsheetApp.getUi()
  .showModalDialog(html, 'Your Signature is Required');
}

function saveImage(bytes){
  var bytes = bytes.split(",")
  var blob = Utilities.newBlob(Utilities.base64Decode(bytes[1]), 'image/png');
  blob.setName("Sign Pic")
  DriveApp.getFolderById("Folder ID to save SignPic").createFile(blob)
}

您将必须跟踪图像文件的名称并将图片相应地插入电子表格。

于 2017-03-28T00:25:15.660 回答