Simple Image Alteration Using SVG

I need the images in the attached [login to view URL] converted so that the numbers are editable in HTML. I’ve completed the first one so you can see what I mean. You will need basic SVG skills to add and move the text to the right place. Please complete the second one (the rectangle) and send back the HTML to show that you can do this. I have many more docs like this that need processing, so good work/price will get lots of work. Process for each image: 1. Save image as a PNG (using a screenshot is fine) 2. Remove the numbers/units (see [login to view URL]) 3. Use the base SVG code below to add the image to [login to view URL] (total image width, should be 400, height can vary according to the particular image) <svg width="400" height=“300" xmlns="[login to view URL]"><image x="0" y="0" href="[login to view URL]" width="400"/></svg> 4. Use <text> to add the text remove in step 2 back to the image in an editable form. The text must appear in the same place and size as it was in the original image. Final HTML for the first image would be (see [login to view URL]) <style> svg text { font-family: "Times New Roman", Times, serif; } </style> </style><svg width="400" height="300" xmlns="[login to view URL]"><image x="0" y="0" href="[login to view URL]" width="400"/><text x="180" y="110">100°</text><text x="218" y="132">35°</text></svg> Thanks in advance!