You could use Canvas
in HTML, simply add a canva
<canvas id="locations" width="400" height="300" style="border:1px solid #d3d3d3;">
Your browser can't read canvas</canvas>
And in Javascript (only an example, that will draw a rectangle on the picture)
var c = document.getElementById("locations");
var ctx = c.getContext("2d");
var img = new Image();
img.src = '{main_photo}';
img.onload = function() { // after the pic is loaded
ctx.drawImage(this,0,0); // add the picture
ctx.beginPath(); // start the rectangle
ctx.moveTo(50,50);
ctx.lineTo(200,50);
ctx.lineTo(200,200);
ctx.lineTo(50,200);
ctx.lineTo(50,50);
ctx.strokeStyle = "sienna"; // set color
ctx.stroke(); // apply color
ctx.lineWidth = 5;
// ctx.closePath();
};