更新/替换Google文档上的内嵌图片

Question

我正在尝试设置一个功能来更新Google文档上的图像,就像Lucidchart Add-on在其"更新的插入图表"功能上所做的那样.为此,我目前正在做以下事情:

• 创建命名范围并将其ID与文档属性一起存储,以生成图像,以便以后检索.
• 在更新时,调用body.getNamedRangeById()并用新生成的图像替换该元素.

这有效,但我有以下Lucidchart不会发生的问题:

• 每次更新时,图像后面都会添加一个空白行.
• 如果用户将图像拖放到文档中以便重新定位它,则命名范围将消失,我以后无法检索它.
• 如果用户集中图像,则在更新后图像返回到左侧位置,甚至复制其属性

有没有人知道更换/更新Google Docs上引用图片的好策略,就像Lucidchart附加更新功能一样？

谢谢

Answer 1

当范围移动时,NamedRanges确实会丢失,所以它们对你的场景不是很好.但是没有其他方法可以识别元素(这是Google Docs的一个很好的错误).

对于图像,您可以使用其LINK_URL来识别它,这似乎是Lucidchart使用的.它不会妨碍用户,因此它可能是一个很好的解决方案.

关于在插入图像时获取空白行和丢失属性,我想(因为您没有共享任何代码),您将图像直接插入文档正文而不是段落.然后会自动创建一个段落来包装您的图像,从而产生空白行并丢失属性.

这是一些代码示例:

function initialInsert() {
  var data = Charts.newDataTable().addColumn(
    Charts.ColumnType.STRING, 'Fruits').addColumn(
    Charts.ColumnType.NUMBER, 'Amount').addRow(
    ['Apple',15]).addRow(
    ['Orange',6]).addRow(
    ['Banana',14]).build();
  var chart = Charts.newPieChart().setDataTable(data).build();

  var body = DocumentApp.getActiveDocument().getBody()
  body.appendImage(chart).setLinkUrl('http://mychart');
  //here we're inserting directly in the body, a wrapping paragraph element will be created for us
}

function updateImage() {
  var data = Charts.newDataTable().addColumn(
    Charts.ColumnType.STRING, 'Fruits').addColumn(
    Charts.ColumnType.NUMBER, 'Amount').addRow(
    ['Apple',Math.floor(Math.random()*31)]).addRow( //random int between 0 and 30
    ['Orange',Math.floor(Math.random()*31)]).addRow(
    ['Banana',Math.floor(Math.random()*31)]).build();
  var chart = Charts.newPieChart().setDataTable(data).build();

  var img = getMyImg(DocumentApp.getActiveDocument().getBody(), 'http://mychart');
  //let's insert on the current parent instead of the body 
  var parent = img.getParent(); //probably a paragraph, but does not really matter
  parent.insertInlineImage(parent.getChildIndex(img)+1, chart).setLinkUrl('http://mychart');
  img.removeFromParent();
}

function getMyImg(docBody, linkUrl) {
  var imgs = docBody.getImages();
  for( var i = 0; i < imgs.length; ++i )
    if( imgs[i].getLinkUrl() === linkUrl )
      return imgs[i];
  return null;
}

关于link_url,您当然可以像Lucidchart那样做并链接回您的网站.所以它不仅仅是为用户打破了.