CODEWITHSUNDEEP
c#jqueryasp.netgoogle-maps-api-3screenshot
Jorge
Jorge

Reputation: 18237

taking a screenshot of some element in the html

So I was wondering, if I have a div which contains a maps of google maps rendered with some makers and I want to take a picture of that element how can I do this?.I found this solutions it's a approach of what I need but the problem it's that sending a url doesn't help me, I need the specific Div with all the markers. For the server side i'm using C# and for the cliente, asp.net with jquery. Also the google maps apiV3 to handle the maps

Upvotes: 0

Views: 2245

Answers (3)

duncan
duncan

Reputation: 31912

Have you considered using the Google Maps Static API - this will render a map image, with markers on it, as a PNG.

Upvotes: 0

James Johnson
James Johnson

Reputation: 46047

Take a look at the Canvas2Image library by Nihilogic Labs:

http://www.nihilogic.dk/labs/canvas2image/

Here's an example of how to take a screenshot of an element through JavaScript:

var oCanvas = document.getElementById("thecanvas");    
Canvas2Image.saveAsPNG(oCanvas);

EDIT

You might also take a look at Html2Canvas and FlashCanvas too. I believe one of them has support for earlier browsers (those which don't support HTML5).

Upvotes: 2

gilly3
gilly3

Reputation: 91467

Use the method in the link you mentioned and crop the resulting image to the dimensions of your div. You can use myDiv.getBoundingClientRect() in JavaScript to get the dimensions of your div.

Using the WebBrowser control, you can manipulate the document using html or JavaScript to get the page in the state you need to take your screenshot.

Upvotes: 1

Related Questions