DEV Community

IT Solutionist, Specialist
IT Solutionist, Specialist

Posted on Edited on

How to convert a image from Google Map(Div)?

1.
Hello. Thanks for reading my article in advance.
As you can see above picture, I have displayed a map using Google Map API.
I want to convert a image from that google map using JavaScript.
Who is Someone expert in this part?
Let's discuss in a detail.
Thanks
2.
I have got a solution.
We can use html2canvas library.

html2canvas(document.getElementById("[your map id]"), {
    useCORS: true,
}).then(function(canvas) {
    var img = canvas.toDataURL("image/jpeg");
    var image = new Image();
    image.src = img;
    document.getElementById("[div to display an image]").appendChild(image);
});
Enter fullscreen mode Exit fullscreen mode

It just displays the google map as an image.
Thanks

Top comments (3)

Collapse
 
aarone4 profile image
Aaron Reese •

Use stack overflow if you need help. Use DEV to demonstrate the solution when you have one

Collapse
 
it718 profile image
IT Solutionist, Specialist •

Hello, Aaron. Thanks for your messaging.

Collapse
 
aarone4 profile image
Aaron Reese •

Nice. I'll be using that.