title: Return canvas (image) in openlayers 4
body: <p>the example shows how to bind a button click event to the canvas and then it returns the image <a href="https://openlayers.org/en/latest/examples/export-map.html?q=export" rel="nofollow noreferrer">Example</a>. How can I change it, that when I use a call openlayers with a permalink, that it automatically returns me that image? I would like to use a simple get request from an c++ programm to get the image. I have the 
  e.g. "#map=12/1085115.28/6035092.46/0" as parsing parameters. Any ideas?
  Thanks and Greetings
  Melina</p>
  
  <p>So far I have the parameter parsing</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;title&gt;OpenStreetMap&lt;/title&gt;
      &lt;link rel="stylesheet" href="https://openlayers.org/en/v4.2.0/css/ol.css" type="text/css"&gt;
      &lt;!-- The line below is only needed for old environments like Internet Explorer and Android 4.x --&gt;
      &lt;script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"&gt;&lt;/script&gt;
      &lt;script src="https://openlayers.org/en/v4.2.0/build/ol.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;div id="map" class="map"&gt;&lt;/div&gt;
      &lt;script&gt;
          var center = [0,0];
          var zoom = 0;
          var rotation = 0;
          if (window.location.has !== '')
          {
           var hash = window.location.hash.replace('#map=', '');
           var parts = hash.split('/');
           console.log (parts);
           if (parts.length === 4)
           {
              zoom = parseInt(parts[0],10);
              center = [
               parseFloat(parts[1]),
               parseFloat(parts[2])
               ];
              rotation = parseFloat(parts[3]);
           var rotation = 0;
          }
      }
        var openStreetMapLayer = new ol.layer.Tile({
          source: new ol.source.OSM({
            attributions: [
              'All maps Â© &lt;a href="http://www.openstreetmap.org"&gt;openStreetMapLayer&lt;/a&gt;',
              ol.source.OSM.ATTRIBUTION
            ],
            opaque: false,
          //  url: '&lt;myosmserver&gt;/hot/{z}/{x}/{y}.png'
          })
        });
  
  
        var map = new ol.Map({
          layers: [
            openStreetMapLayer
          ],
          target: 'map',
          controls: ol.control.defaults({
            attributionOptions: /** @type {olx.control.AttributionOptions} */ ({
              collapsible: false
            })
          }),
          view: new ol.View({
            maxZoom: 20,
            center: center,
            zoom: zoom
          })
        });
  
      &lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>