On the single property page, I expect that you may want a fully interactive map, and for that you simply add a Map block and for the marker in the settings in the sidebar specify Dynamic Source for the marker, choosing the appropriate address custom field.
To add a static image to the loop items of your View, the first thing you need to do is to check your Google API key to ensure that it can be used for the Maps Static API.
You can see details of the Maps Static API here: hidden link
And it should be possible to update your API key to include the Maps Static API here: hidden link
You can test that it is working by just pasting in this example from the Google documentation into your browser, although you will need to update the API key with your key:
<em><u>hidden link</u></em>
&markers=color:blue%7Clabel:S%7C40.702147,-74.015794&markers=color:green%7Clabel:G%7C40.711614,-74.012318
&markers=color:red%7Clabel:C%7C40.718217,-73.998284
&key=YOUR_API_KEY
When you have confirmed that you have it working, make a note of the slug of the address field for your property post type (I think on your site it is "adres", that's what I'll use in the example below).
While editing the View, in the output section insert a Custom HTML block where you would like the image to appear.
We are going to add an img tag, and set the src to be a URL like the maps.googleapis.com example above, except we'll need to provide the location dynamically, which we'll do using a shortcode.
So you would add the following to the Custom HTML block:
<img class="image-cover" src="<em><u>hidden link</u></em> field='adres' format='FIELD_LATITUDE,FIELD_LONGITUDE'][/types]&zoom=16&size=800x400&maptype=hybrid&markers=|[types field='adres' format='FIELD_LATITUDE,FIELD_LONGITUDE'][/types]
&key=YOUR_API_KEY">
<style type="text/css">
.image-cover {
object-fit: cover;
height: 400px;
}
</style>
Several things to note.
First, you need to provide your API key.
Second, there are several parameters provided that you may want to modify, for example the initial zoom level, and the image size (specified in pixels).
Lastly I included a little CSS, which includes the image height that should match that provided in the URL parameters.
The purpose of this is to prevent the image shrinking when the screen narrows and the available space for the image is less than its width. Instead of shrinking the image to maintain its aspect ratio (making it more difficult to read any text on the image), the height is kept constant and the visible part of the image is reduced (the edges disappear). I think that is better for usability, but you are welcome to change it of course.
If you didn't want to include a full interactive map on the property listing page and only wanted to include a static map image there too then you can use the same technique instead of adding a Map block.