0

I've a requirement to have a map control (with the addition of data plotting using bubbles, pins etc) to display in our website. The user should then have the ability to export this map as an image.

Does anyone know if that is possible? I'm trying to use this control: http://www.telerik.com/aspnet-mvc/map with ASP.Net MVC5

If not, is there a method using other controls to do this?

Ben
  • 3,926
  • 12
  • 54
  • 87
  • I believe that you are entering a mine field... map images themselves invariably belong to the 'organisation' that created them. To allow a user to export the map as an image; for what purpose? publish in a magazine? publish on a website? etc I believe is very open ended and fraught with copyright issues... However see http://www.telerik.com/forums/how-to-save-map-into-image-file for how to save. – Paul Zahra Jan 13 '15 at 09:43
  • It's for reporting purposes. Their data will be plotted onto a map, and when they generate a report through our system, we want the map to be a part of that report. – Ben Jan 13 '15 at 09:51
  • To be honest I would be supprised if Telerik provides more functionality than Google Maps API http://stackoverflow.com/questions/11594702/how-to-get-image-from-google-static-map-api and http://stackoverflow.com/questions/1142821/google-maps-image – Paul Zahra Jan 13 '15 at 12:08
  • I've had a quick look of Google Mp API terms and conditions and couldn't see anything that would stop you doing this however it was a quick look, and it seems to me that the actual maps themselves belong to 'mapping' organisations and effectively you would be distributing / storing their product. – Paul Zahra Jan 13 '15 at 12:10

2 Answers2

0

I have found below link which might helpful to you.

Export Functionality

Note: Please check your kendo ui version first. Because all version don't provide this functionality.

Priyank Sheth
  • 2,352
  • 19
  • 32
0

You can use the Kendo Drawing API for this.

  1. Read about the Kendo Drawing API, this should give you an idea of how it works. I've borrowed some code from the example we'll use in the next step.
  2. Visit the map demo page and open a console. Copy and paste the code example below in your console window and hit enter. You should be prompted download an image of the map displayed.

This can be customized by changing the value in drawDOM to your own map's wrapper element. Also, replace the proxyURL with your own as needed.

    // Convert the DOM element to a drawing using kendo.drawing.drawDOM
    kendo.drawing.drawDOM($("#exampleWrap"))
    .then(function(group) {
        // Render the result as a PNG image
        return kendo.drawing.exportImage(group);
    })
    .done(function(data) {
        // Save the image file
        kendo.saveAs({
            dataURI: data,
            fileName: "example.png",
            proxyURL: "http://demos.telerik.com/kendo-ui/service/export"
        });
    });
Ed Charbeneau
  • 4,501
  • 23
  • 23
  • Hi @ed, this doesn't work for layers laid over the top such as the bubble layer (which is mainly what I'm after). Running that same code against: http://demos.telerik.com/aspnet-mvc/map/bubble-layer only downloads the map as an image, no bubbles. – Ben Jan 13 '15 at 15:14
  • Ah, ok. It seems like the bubbles are SVG and are not being included in the exported image. – Ed Charbeneau Jan 13 '15 at 15:42