Search code examples
google-docsgoogle-apps-scriptgoogle-docs-api

Insert image into a specified location


I have a Google Apps script which replaces placeholders in a copy of a template document with some text by calling body.replaceText('TextA', 'TextB');.

Now I want to extend it to contain images. Does anybody have idea how to do this?

Thank you, Andrey

EDIT: Just to make it clear what my script does. I have a Google form created in a spreadsheet. I've created a script which runs upon form submission, traverses a sheet corresponding to the form, find unprocessed rows, takes values from corresponding cells and put them into a copy of a Google document. Some fields in the Google form are multi-line text fields, that's where '\r\r' comes from.

Here's a workaround I've come up with by now, not elegant, but it works so far:

// replace <IMG src="URL"> with the image fetched from URL
function processIMG_(Doc) {

  var totalElements = Doc.getNumChildren();

  for( var j = 0; j < totalElements; ++j ) {

    var element = Doc.getChild(j);
    var type = element.getType();

    if (type =='PARAGRAPH'){
      var par_text = element.getText();

      var start = par_text.search(new RegExp('<IMG'));
      var end = par_text.search(new RegExp('>'));
      if (start==-1)
        continue;

      // Retrieve an image from the web.
      var url = getURL_(par_text.substring(start,end));
      if(url==null)
        continue;

      // Before image
      var substr = par_text.substring(0,start);
      var new_par = Doc.insertParagraph(++j, substr);

      // Insert image
      var resp = UrlFetchApp.fetch(url);
      new_par.appendInlineImage(resp.getBlob());

      // After image
      var substr = par_text.substring(end+1);
      Doc.insertParagraph(++j, substr);

      element.removeFromParent();
      j -= 2; // one - for latter increment; another one - for increment in for-loop
      totalElements = Doc.getNumChildren();      
    }      
  }
}

Solution

  • Here is a piece of code that does (roughly) what you want.

    (there are probably other ways to do that and it surely needs some enhancements but the general idea is there)

    I have chosen to use '###" in the doc to mark the place where the image will be inserted, the image must be in your google drive (or more accurately in 'some' google drive ). The code below uses a document I shared and an image I shared too so you can try it. here is the link to the doc, don't forget to remove the image and to put a ### somewhere before testing (if ever someone has run the code before you ;-)

    function analyze() { // just a name, I used it to analyse docs
      var Doc = DocumentApp.openById('1INkRIviwdjMC-PVT9io5LpiiLW8VwwIfgbq2E4xvKEo');
      var image = DocsList.getFileById('0B3qSFd3iikE3cF8tSTI4bWxFMGM')
        var totalElements = Doc.getNumChildren();
        var el=[]
        for( var j = 0; j < totalElements; ++j ) {
          var element = Doc.getChild(j);
          var type = element.getType();
    Logger.log(j+" : "+type);// to see doc's content
           if (type =='PARAGRAPH'){
           el[j]=element.getText()
           if(el[j]=='###'){element.removeFromParent();// remove the ###
             Doc.insertImage(j, image);// 'image' is the image file as blob 
             }
           }
        }
    }
    

    EDIT : for this script to work the ### string MUST be alone in its paragraph, no other character before nor after... remember that each time one forces a new line with ENTER the Document creates a new paragraph.