For my web application, I am looking to provide users with the ability to choose from a variety of signature styles. Whenever a user selects a specific signature style, I would like to capture an image of that signature and save it on the server. I attempted to use the canvas2html library for this purpose, but unfortunately, it did not work as expected.
I have scoured through various Vue libraries in search of a solution that can take a picture of a particular element, rather than capturing a screenshot of the entire webpage. However, most options available only offer the functionality to capture screenshots of the entire webpage.
mounted() {
// The element may not have been added to the DOM yet
this.$nextTick(() => {
// The element has definitely been added to the DOM
// Is there any way to access the div element using `el` variable???
html2canvas(document.getElementById('container')).
then(function(canvas) {
document.body.appendChild(canvas);
});
console.log(this.$el.textContent); // Represents the text inside the component.
});
}