Canvas drawImage используя данные URL

Question

Я начну со сценария:

  function saveInstance() {
   _savedInstance = document.getElementById('canvasID').toDataURL();
  }
  function restoreInstance() {
   ctx.drawImage(_savedInstance,0,0);
  }

Цель состоит в том, чтобы сохранить экземпляр холста и повторно применить его позже [Аналогично тому, как ctx.save () сохраняет стиль и преобразования].

Однако я получил ошибку, в которой говорится о несовместимых типах (Uncaught Error: TYPE_MISMATCH_ERR: DOM Exception 17).Есть ли какой-нибудь метод canvas, который позволит мне использовать строку URL-адреса данных для перерисовки экземпляра?

** Если есть лучший способ реализовать эту идею сохранения / восстановления, которая у меня есть, это такжеочень ценится.

-Firstmate

Answer 1

Да, вы можете создать элемент изображения с его источником как _savedInstance и затем нарисовать его на холсте.

var img = new Image();
img.src = _savedInstance;
ctx.drawImage(img,0,0);