How do you add a connecting line to a google slides presentation using app scripts?

Question

I am trying to follow the Google Slides API reference material; 'Lines' but I must be missing something. I have successfully added rectangle shapes using the script, but now I want to connect them with a line. Here is what I have so far:

function addConnections()
{
  var myPresentation = SlidesApp.getActivePresentation()
  var presentationId = myPresentation.getId();
  var slideId = myPresentation.getSlides()[0].getObjectId()

  var requests = []

    requests.push(
    {
      createLine: 
      {
        lineProperties: 
        {
          startConnection: 
          {
            connectedObjectId: 'queryD200',
            connectionSiteIndex: 3
          },
          endConnection: 
          {
            connectedObjectId: 'queryD201',
            connectionSiteIndex: 0
          }
        },
        lineType: 'CURVED_CONNECTOR_2'
      }
    })

  Slides.Presentations.batchUpdate({requests: requests}, presentationId);

}

The error that I get is: Unknown name "lineType" at 'requests[0].create_line': Cannot find field. Unknown name "lineProperties" at 'requests[0].create_line': Cannot find field.

But those are the exact field names that google uses in their documentation. I tried them both with quotations and without. Please Help! and thank you

Tanaike · Accepted Answer · 2020-05-01T01:10:47.277

I believe your goal as follows.

You want to connect 2 shapes with a line on Google Slides.
You want to achieve this using Slides API with Google Apps Script.

For this, how about this answer?

Modification points:

There is no property of lineProperties in createLine.
There is no property of lineType in LineProperties.
In your request body, the property of fields is not used.
In order to connect 2 shapes with a line, in your situation, how about the following flow?
1. Create a line object using createLine.
2. Update the line object using lineProperties.
  - lineProperties can be used for the existing line object using UpdateLinePropertiesRequest.

Modified script:

When your script is modified, it becomes as follows.

function addConnections() {
  var myPresentation = SlidesApp.getActivePresentation()
  var presentationId = myPresentation.getId();
  var slideId = myPresentation.getSlides()[0].getObjectId();

  var lineObjectId = "sampleline001";
  var startShape = "queryD200";
  var endShape = "queryD201";

  var requests = [
    {createLine: {
      objectId: lineObjectId,
      lineCategory: "CURVED",
      elementProperties: {pageObjectId: slideId, size: {height: {magnitude: 1 ,unit: "PT"}, width: {magnitude: 1, unit: "PT"}}}
    }},
    {updateLineProperties: {
      objectId: lineObjectId,
      lineProperties: {startConnection: {connectedObjectId: startShape}, endConnection: {connectedObjectId: endShape}},
      fields: "startConnection,endConnection"
    }}
  ];
  Slides.Presentations.batchUpdate({requests: requests}, presentationId);
}

Sample script:

As another pattern, you can also achieve this using Slides service instead of Slides API.

function addConnections() {
  var myPresentation = SlidesApp.getActivePresentation()
  var presentationId = myPresentation.getId();
  var slide = myPresentation.getSlides()[0];
  var slideId = slide.getObjectId();

  var startShape = "queryD200";
  var endShape = "queryD201";

  var line = slide.insertLine(
    SlidesApp.LineCategory.CURVED,
    slide.getPageElementById(startShape).asShape().getConnectionSites()[0],
    slide.getPageElementById(endShape).asShape().getConnectionSites()[0]
  );
}

Result:

When above both scripts are run for 2 shapes, the following result can be obtained.

Note:

I'm not sure whether the shape object IDs queryD200 and queryD201 are correct. So please be careful this.

References:

Thank you very much for your quick and thorough response. I will look into your suggestions and let you know how it goes. — Day4, May 01 '20 at 01:10
as for the shape object IDs I made them up, so I know they are correct. — Day4, May 01 '20 at 01:11
@Day4 Thank you for replying. I added one more sample script without using Slides API. You can both scripts. If I misunderstood your question, I apologize. — Tanaike, May 01 '20 at 01:11
That worked great, my problem was not understanding that I needed to create the line first and then modify it with "updateLineProperties" in a separate request. I like how slick your second suggestion is, however I opted to use the first because I had more than 400 lines to draw. So I created a loop to push the line create and line update objects to the request array. then threw it all through the batch update... cha-ching worked like a charm. Thanks Again — Day4, May 01 '20 at 03:36
@Day4 Thank you for replying. I'm glad your issue was resolved. Thank you, too. — Tanaike, May 01 '20 at 08:46

score 0 · Answer 2 · answered May 01 '20 at 03:48

@Tanaike I am posing the code that I ended up using just in case it is useful to anyone else. 'arrayCon' is an array of elementId pairs that I needed to connect with the lines. There were well over 400 pairs but batching them together into one request array was very efficient taking no more than 3 or 4 seconds to complete.

for(var i = 0;i<arrayCon.length;i++)
  {
    var lineId = 'lineConn'+i;
    var startCon = arrayCon[i][0]
    var endCon = arrayCon[i][1]

    requests.push(
    {
      createLine: 
      {
        objectId: lineId,
        lineCategory: 'CURVED',
        elementProperties: {pageObjectId: slideId, size: {height: {magnitude: 1 ,unit: "PT"}, width: {magnitude: 1, unit: "PT"}}}
      }
    })
    requests.push(
    {
      updateLineProperties: 
      {
        objectId: lineId,
        fields: 'startConnection,endConnection',
        lineProperties: 
        {
          startConnection:
          {
            connectedObjectId: startCon,
            connectionSiteIndex: 2
          },
          endConnection:
          {
            connectedObjectId: endCon,
            connectionSiteIndex: 0
          }
        }
      }
    })

  }

  Slides.Presentations.batchUpdate({requests: requests}, presentationId);

}