Добавить текст в строку base64 на картинке - PullRequest
0 голосов
/ 02 мая 2019

У меня есть холст, где я получаю подпись (браузерное приложение, JavaScript).Я получаю эту подпись в строке base64, и я могу скачать ее.Это работает нормально.Теперь я хочу добавить текст к картинке (base64-строка).

В своем исследовании я сталкивался с различными методами, такими как водяные знаки, но это не работает для меня, и я думаю, что это немного сложно.Есть ли возможность или простой способ добавить текст в строку base64?

downloadpic: function () {
      var sign = this.getView().byId("Signature");
      var imagetxtb64 = sign.getSigAsJpeg();

      var image = new Image();
      var element = document.createElement('a');

      image.src = imagetxtb64;

      element.setAttribute('href', image.src);
      element.setAttribute('download', 'image');
      element.style.display = 'none';

      element.click();
    }

В переменной imagetxtb64 есть строка base64.Могу ли я изменить его, добавив в него какой-нибудь текст?

Обновление:

Теперь у меня есть следующая функция:

    downloadtext: function () {

    var canvas = document.createElement("canvas");


    var sign = this.getView().byId("Signature");
    var imagetxtb64 = sign.getSigAsJpeg();

    var ctx = canvas.getContext('2d');
    ctx.drawImage(imagetxtb64, 0, 0);

    var randomtxt = "Random Text";
    ctx.font = "30px Arial";
    ctx.strokeText(randomtxt, 10, 50);

    var dataURL = canvas.toDataURL();
    console.log(dataURL);

    var image = new Image();
    var element = document.createElement('a');

    image.src = dataURL;

    element.setAttribute('href', image.src);
    element.setAttribute('download', 'image');
    element.style.display = 'none';

    element.click();

    },

Я думаю, с помощью ctx.drawImage(imagetxtb64, 0, 0); я загружаюсуществующий холст в новом.

Но когда я пытаюсь выполнить это, я получаю следующую ошибку:

Uncaught TypeError: Не удалось выполнить 'drawImage' для 'CanvasRenderingContext2D': предоставленное значение не относится к типу '(CSSImageValue или HTMLImageElement или SVGImageElement или HTMLVideoElement или HTMLCanvasElement или ImageBitmap или OffscreenCanvas) '

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...