How to give focus to canvas of signature pad?

Ionic Framework ionic-v3
1

I have a signature pad and a tinymce editor in a page of my ionic/angular application(android). Both are working fine. But i am facing an weird problem. When the tinymce editor is in focus, the keyboard is showing. Now, if i click on the canvas, the keyboard is still open and the tinymce editor is still in focus.

My html code:

  <ion-row class="signature-pad-input">
    <signature-pad [options]="signaturePadOptions" (onBeginEvent)="drawStart()"
                   (onEndEvent)="drawComplete()">
    </signature-pad>
  </ion-row>
  <ion-row class="note-editor" id="noteAreaTinyMce">
    <app-tinymce class="note-input-textarea" [(ngModel)]='noteText'></app-tinymce>
  </ion-row>

#Try1:
This link states that Canvas elements are not focusable by default. So, i tried to give focus to canvas using below code:

let canvas= <HTMLElement> document.querySelector('signature-pad>canvas');
canvas.focus();

But, the keyboard is still there and tinymce editor is holding the focus.

#Try2:
Then i tried to unfocus the tinymce editor rather giving focus to canvas of signature pad using below code:

import {Renderer2} from '@angular/core';
export class AddProgressNotePage {

constructor(private renderer: Renderer2){}

  drawStart() {
    // Making tinymce editor blur
    this.renderer.selectRootElement('.note-input-textarea>iframe').blur();
  }
}

This works. It closes the keyboard. But, when the keyboard closes, it pushed down the page and as my finger is in the canvas, unexpected drawings are being done there.

Is there any other way to give canvas focus?