"Converting circular structure to JSON" while stringifying object in Angular

Question

I am having issues with stringifying a set of the object which holds data from ng2 canvas in one of the keys. The code is

tabs.forEach((t, i) => {
 const sessionCanvasData = JSON.parse(sessionStorage.getItem('canvasUpdates' + t));

 const tabData = {
    tabId: t,
    emojiDragData: sessionStorage.getItem('dragObject' + t),
    textDragData: sessionStorage.getItem('textData' + t),
    canvasData: sessionCanvasData,
    openWhiteboard: this.whiteboardFlag,
    clearCanvasData: this.clearCanvas,
    control: this.activateControl,
    isClientDrawing: this.clientDrawing,
    isTherapistDrawing: this.therapistDrawing,
    imageId: this.imageIds,
  };

  const stringifiedTabData = JSON.stringify(tabData);
});

When the code reaches the stringify section, it throws

ERROR TypeError: Converting circular structure to JSON
    --> starting at object with constructor 'Subscriber'
    |     property '_subscriptions' -> object with constructor 'Array'
    |     index 0 -> object with constructor 'SubjectSubscription'
    --- property '_parentOrParents' closes the circle
    at JSON.stringify (<anonymous>)

The data format is:

{"tabId":1,"emojiDragData":null,"textDragData":null,"canvasData":[{"x":0.5702628686401997,"y":0.6947257661449427,"type":0,"UUID":"01c0f112-da17-a2c5-c82b-11303769f068","selectedShape":"FreeHandShape","selectedShapeOptions":{"shouldFillShape":true,"fillStyle":"rgb(246,178,11)","lineJoin":"round","lineCap":"round"}},{"x":0.5702628686401997,"y":0.6947257661449427,"type":2,"UUID":"01c0f112-da17-a2c5-c82b-11303769f068"}],"openWhiteboard":false,"control":true,"isClientDrawing":false,"isTherapistDrawing":true,"imageId":[]}