none
Export Map as Image RRS feed

  • Question

  • Hello I want to Export that what the control is showing the same way RenderTargetBitmap do in Bing Maps for UWP.

    Is it possible and if how.

    I read this in an official announcement of the new V8 control:

    Export Map as an Image – Being able to visualize your
    data on a map is great, but this feature makes it easy to share an image
    of that map with others. Add it to a report, email it, or put it in a
    presentation.

    What they mean with that technically? How is it done?

    Thanks


    Freudi

    Wednesday, September 21, 2016 8:29 AM

Answers

  • The export map as an image feature mentioned for V8 was mentioned as a future feature of the API. This feature is not yet available but likely will be within the next 3 to 4 months. When this is exposed there will likely be a simple function on the map where you can do something like map.exportImage() or map.screenshot(). This will then flatten all the canvases the map uses into a single canvas and return the data URL for the resulting canvas. Certain elements won't be supported such as Infoboxes as they are rendered using HTML DOM elements and are not drawn on the canvas. Other things that will not appear in the final image will be the navigation bar. Other than that, all the built in visualizations should be rendered on the final image.

    [Blog] [twitter] [LinkedIn]

    • Proposed as answer by Ricky_Brundritt Wednesday, September 21, 2016 7:49 PM
    • Marked as answer by Freudi Thursday, September 22, 2016 1:23 PM
    Wednesday, September 21, 2016 7:48 PM
  • There was another post on this topic recently but can't seem to find it at the moment. Basically, this feature was cut as there are two many cross browser limitations that result in only a subset of the mapping functionality being able to work. Instead we made a code sample of how to do this with guidance on what won't work. You can find it here: 

    http://bingmapsv8samples.azurewebsites.net/#Map%20Image%20Generator


    [Blog] [twitter] [LinkedIn]

    Saturday, April 29, 2017 4:19 AM
  • This was never official supported and the sample was only an experiment, as noted in the details of the sample. This works with the frozen branch as it hasn't been updated in over a year and is missing a lot of features. Note that this hack stopped working in the main release branch around Feb/March.

    [Blog] [twitter] [LinkedIn]


    Wednesday, August 2, 2017 2:35 PM
  • The sample has been updated and is working again. It is currently enable an undocumented feature which enables CORs in the map. This causes issues with custom tile layers that are hosted on a different domain than your web page, and as such is disabled by default. The team plans to add an official map option for enabling CORs in the future. 

    [Blog] [twitter] [LinkedIn]

    Monday, August 14, 2017 11:23 PM

All replies

  • The export map as an image feature mentioned for V8 was mentioned as a future feature of the API. This feature is not yet available but likely will be within the next 3 to 4 months. When this is exposed there will likely be a simple function on the map where you can do something like map.exportImage() or map.screenshot(). This will then flatten all the canvases the map uses into a single canvas and return the data URL for the resulting canvas. Certain elements won't be supported such as Infoboxes as they are rendered using HTML DOM elements and are not drawn on the canvas. Other things that will not appear in the final image will be the navigation bar. Other than that, all the built in visualizations should be rendered on the final image.

    [Blog] [twitter] [LinkedIn]

    • Proposed as answer by Ricky_Brundritt Wednesday, September 21, 2016 7:49 PM
    • Marked as answer by Freudi Thursday, September 22, 2016 1:23 PM
    Wednesday, September 21, 2016 7:48 PM
  • Do you know if we're any closer to having export or snapshot capabilities?

    Thanks!

    Thursday, April 27, 2017 10:07 PM
  • Not a mm :-(

    For a short time we found something with canvas, not related to the Bing Maps Web Control,which is working in some new Browsers but all of the new browser now ask the tile-server (or better the source of the pic's in the canvas)  if it is allowed to use this function and all say "no" :-(

    You can Google "canvas" and the memberfunction "toDataURL" if you want dive deeper into that.


    Freudi

    Friday, April 28, 2017 8:58 AM
  • There was another post on this topic recently but can't seem to find it at the moment. Basically, this feature was cut as there are two many cross browser limitations that result in only a subset of the mapping functionality being able to work. Instead we made a code sample of how to do this with guidance on what won't work. You can find it here: 

    http://bingmapsv8samples.azurewebsites.net/#Map%20Image%20Generator


    [Blog] [twitter] [LinkedIn]

    Saturday, April 29, 2017 4:19 AM
  • As you  mentioned, this feature will be available in few months, but now it is more than 6 months and still this feature is not available. also then one of the sample (http://bingmapsv8samples.azurewebsites.net/#Map%20Image%20Generator ) is not working. Kindly provide us the solution as we need to roll off the v8 changes to our production environment.
    Wednesday, June 21, 2017 9:06 AM
  • As noted, this will not be added as a feature. The fact that the sample is broke is a great example of why this feature was cut. It simply requires too much of a hack to support and even when working has a lot of limitations. This is why the sample is in the experimental folder of the sample site and also has a warning on it.

    [Blog] [twitter] [LinkedIn]


    Friday, June 23, 2017 8:08 PM
  • It might be helpful if you amended the posting at:

    https://blogs.bing.com/maps/June-2016/Bing-Maps-V8-Web-Control-Released

    To remove or add a note that "export map as image" will not be implemented.

    As a developer, this has been a frustrating search to do something I thought would be fairly straightforward and that is to take a map with my POIs and shapes and render it as some type of bitmap that I can use to incorporate in a PDF or Word Document.  The PDF/Word rendering would be done on the server side with my application creating some type of empty canvas and directing a mapping engine to draw the map and my POI/shape data at the specified lat/long's. So far, I've not found a way to do this with either Google or Microsoft mapping.  Suggestions are appreciated.

    Wednesday, June 28, 2017 5:40 PM
  • Done. I also have the team looking into what changed caused the experimental sample code to break as well. I suspect it is that the requirement for tile layers to use CORs was removed as it was causing issues for many using tile layers, which would mean that the base map tiles are no longer using CORs and thus when added to the canvas can't be exported as an image.

    [Blog] [twitter] [LinkedIn]

    Wednesday, June 28, 2017 6:25 PM
  • If you're rendering the bitmap server-side anyway, could you use the UWP map control and RenderTargetBitmap to snapshot the map view?
    Thursday, June 29, 2017 4:29 PM
    Moderator
  • Duncan - I've tried using the WPF MapControl and rendering to a bitmap.  When the MapControl is not first placed in a real UI Window, it will only render the scale legend as attached below.  Here is the code that I used to test the theory.  Again suggestions are appreciated.  Thanks!

          Canvas c = new Canvas();
          Microsoft.Maps.MapControl.WPF.Map map = new Microsoft.Maps.MapControl.WPF.Map();
          map.CredentialsProvider = new ApplicationIdCredentialsProvider("my_map_key");
          map.Center = new Location(47.6424, -122.3219);
    
          Canvas.SetTop(map, 0);
          Canvas.SetLeft(map, 0);
          c.Children.Add(map);
          var size = new Size(1024, 1024);
    
          c.Measure(size);
          c.Arrange(new Rect(size));
          c.UpdateLayout();
          RenderTargetBitmap rtb = new RenderTargetBitmap(1024, 1024, 96, 96, PixelFormats.Pbgra32);
          rtb.Render(c);
    
          PngBitmapEncoder png = new PngBitmapEncoder();
          png.Frames.Add(BitmapFrame.Create(rtb));
          using (FileStream f = new FileStream("test.png", FileMode.Create)) {
            png.Save(f);
          }


    • Edited by Marshall D Thursday, June 29, 2017 6:11 PM spelling
    Thursday, June 29, 2017 6:10 PM
  • The WPF control is an older code base and probably won't work for non-UI scenarios. Have you tried the UWP control?
    Thursday, June 29, 2017 8:34 PM
    Moderator
  • I was not very familiar with UWP and the UWP Map control. I did a little research and have some issues that, I believe, prevent its use in my scenario.

    1. I need the map to render as an image on the server side (running Server 2012 under IIS). I can't find any reference to UWP controls working on a server platform.

    2. Just for kicks, I tried to create some code with a UWP project on Win 10 with VS 2015. I am not able to execute RenderTargetBitmapRenderAsync(map) as it throws an exception (Value does not fall within the expected range).  Research on RenderTargetBitmap says:

    "Content that's not directly connected to the XAML visual tree and the content of the main window won't be captured"

    So I think the UWP is out.

    Monday, July 3, 2017 9:08 PM
  • I have the same problem that I cannot export an image from a shown map. Previously it was working after last (June?) update, it is only working within the frozen branch of the bing mas v8 ajax control.

    The code sample on http://bingmapsv8samples.azurewebsites.net/#Map%20Image%20Generator is also not working anymore.

    This is because of toDataUrl of the canvas'es of the map isn't allowed anymore. Is this a bug/known issue or is it intended to not work?

    In addition: the export is working by using the frozen-branch.
    Wednesday, August 2, 2017 10:56 AM
  • This was never official supported and the sample was only an experiment, as noted in the details of the sample. This works with the frozen branch as it hasn't been updated in over a year and is missing a lot of features. Note that this hack stopped working in the main release branch around Feb/March.

    [Blog] [twitter] [LinkedIn]


    Wednesday, August 2, 2017 2:35 PM
  • The sample has been updated and is working again. It is currently enable an undocumented feature which enables CORs in the map. This causes issues with custom tile layers that are hosted on a different domain than your web page, and as such is disabled by default. The team plans to add an official map option for enabling CORs in the future. 

    [Blog] [twitter] [LinkedIn]

    Monday, August 14, 2017 11:23 PM
  • Hi Ricky,

    Is their any way we can export map with navigation data. We want to export bing map as PDF in our MVC,Javascript project.Please give any suggestion.

    Thursday, January 17, 2019 6:26 AM
  • Hi Ajit,

    We don't support export to PDF but the link to the V8 sample does still function so you can look at the code that creates the png file that you should be able to insert into a PDF.  

    Also, you can create a custom USR with the route so that the user can click the link to get the most recent version of the map rather than a stored image.  See https://docs.microsoft.com/en-us/bingmaps/articles/create-a-custom-map-url

    Sincerely,

    IoTGirl

    Thursday, January 17, 2019 10:52 PM
    Owner