JQuery Signature Pad: получить вывод в формате JSON, используя типизированную версию
Я использовал плагин jQuery Signature Pad Томаса Дж. Брэдли для захвата нарисованных подписей, и он хорошо работает. То, что я хотел бы сделать, это также разрешить типизированные подписи, как показано в демонстрации, но сделать так, чтобы они выводили те же данные, что и нарисованная подпись (представление JSON).
Поскольку вывод данных - это фактические координаты курсора при его перемещении по холсту, я предполагаю, что ему придется эмулировать движение мыши или касания. Я нашел другой ответ Stackru о рисовании текста на холсте. Есть ли способ подражать отслеживанию этого нарисованного текста? Если так, то это может быть одним из решений.
Обновить
Я отказался от своего первоначального плана.
Поскольку моей конечной целью было получить один и тот же результат, будь то печатная или нарисованная подпись, я решил использовать getSignatureImage()
метод. Тем не менее getSignatureImage()
Метод работает только с нарисованной версией подписи. Я реализовал следующий код, чтобы "нарисовать" напечатанную подпись на временном холсте:
var canvas = $("canvas").get(0);
var ctx = canvas.getContext("2d");
// signature_name is the id of the input element
var tempCanvasHtml = '<canvas id="temp_canvas" style="display:none;" width="400" height="120"></canvas>';
$(".signature_form").append(tempCanvasHtml);
var tempCanvas = $("#temp_canvas").get(0);
var tempCtx = tempCanvas.getContext("2d");
tempCtx.font = "3.875em/50px 'Journal',Georgia,Times,serif";
tempCtx.fillStyle = '#145394';
tempCtx.fillText($("#signature_name").val(), 5, 90);
var img = tempCanvas.toDataURL("image/png");
tempCanvas.remove();
Я запускаю этот код, когда подпись принята или форма отправлена. Если подпись была нарисована, я использую getSignatureImage()
, когда он напечатан, я использую приведенный выше код.
Примечание: использование этого кода создаст изображение без фона холста, что плагин не поддерживает getSignatureImage()
, Я должен был изменить плагин.