I'm working on a project in Wordpress that requires me to tag photo posts on an overlay map. I'm using the Advanced Custom Fields plugin in Wordpress to pass off latitude, longitude, and location name fields and inserting them into a link that says the Location name and links to a FancyBox overlay that displays the embedded version of OpenStreetMap with lat/lon coordinates passed off as variables in the link URL. My code looks something like this:
This picture was taken at <a class="fancybox-iframe"
href="http://www.openstreetmap.org/export/embed.html?
bbox=-77.44244992733002%2C37.536657186828165%2C-
77.43791699409485%2C37.53942209826503&layer=mapnik&marker=<?php the_field('lat'); ?
>%2C<?php the_field('lon'); ?>"><?php the_field('location_name'); ?></a>
The problem lies in the "bbox" parameter. It look as if it pulled this from the original embed code I pulled from OSM. If I remove it, it zooms all the way out on the map, displaying the entire world. I need it to use the marker as a center and set the "bbox" variable and zoom accordingly.
I've found a few other solutions on here, but they only work for a one-off approach, as you have to manually enter the coordinates within the script. I'm going to be listing a bunch of these on the front page of the site, so that approach won't work.
Any help solving this problem or finding an alternative would be greatly appreciated.