syntaxgetsrc(filtered: boolean): string
parameters filtered − this parameter is a boolean value which indicates whether the source is needed for svg or not.
using the getsrc method examplein this example, we have used the getsrc method to obtain the original source of the image. it can be seen in the console that a string representation of the source of the image is returned.
<!doctype html><html><head> <!-- adding the fabric js library--> <script src=https://cdnjs.cloudflare.com/ajax/libs/fabric.js/510/fabric.min.js></script></head><body> <h2>using the getsrc method</h2> <p> you can open the console from dev tools to see that the logged output contains the image source </p> <canvas id=canvas></canvas> <img src=https://www.tutorialspoint.com/images/logo.png id=img1 style=display: none /> <script> // initiate a canvas instance var canvas = new fabric.canvas(canvas); canvas.setwidth(document.body.scrollwidth); canvas.setheight(250); // initiating the image element var imageelement = document.getelementbyid(img1); // initiate an image object var image = new fabric.image(imageelement, { top: 50, left: 110, skewx: 15, }); // add it to the canvas canvas.add(image); // using the getsrc method console.log(the source of the image is: , image.getsrc(false)); </script></body></html>
using the getsrc method along with fromurl method examplelet’s see a code example of the logged output when the getsrc method is used in conjunction with the fromurl method.
<!doctype html><html><head> <!-- adding the fabric js library--> <script src=https://cdnjs.cloudflare.com/ajax/libs/fabric.js/510/fabric.min.js></script></head><body> <h2>using the getsrc method along with fromurl method</h2> <p> you can open the console from dev tools to see that the logged output contains the image source </p> <canvas id=canvas></canvas> <script> // initiate a canvas instance var canvas = new fabric.canvas(canvas); canvas.setwidth(document.body.scrollwidth); canvas.setheight(250); // using fromurl method fabric.image.fromurl( https://www.tutorialspoint.com/images/logo.png, function (img) { canvas.add(img); // using getsrc method console.log(the source of the image is: , img.getsrc(false)); } ); </script></body></html>
以上就是如何使用fabricjs获取图像的源代码？的详细内容。