Save static map in Base64 image? - Mapquest

Question

I use Static Image API - http://www.mapquestapi.com/staticmap/.

And I need to get to Base64 image.

Is it possible?

Answer 1

You can try, but mapquest may not allow cross-origin resource sharing on their static images.

The following code will work when CORS is correctly configured, or if the image is on the same domain as the calling JavaScript.

If that does not work for you, then you will need to echo the source image through a handler on your same domain.

function getImage(url) {
    var c = document.getElementById("canvas");
    var ctx=c.getContext("2d");    
    var img = new Image();
    img.src = url;
    img.onload = function(){
      ctx.drawImage(img, 400, 200);
      document.getElementById("output").src = canvas.toDataURL("image/png");
    }
}

getImage("http://lorempixel.com/400/200/");

<canvas id="canvas" style="display:none;">
</canvas>
<img id="output" />