Fetching variable within iframe

Permalink
I have two pieces of code, both of which need to fetch a static google map. The first one (inside a div) works, but the second (inside an iframe) doesn't. The link are identical in both. But I can't figure out why the map doesn't show in the iframe; possibly something to do with including variables in iframes compared with inside divs...?

<div id="sidemap">
                    <img src="http://maps.google.com/maps/api/staticmap?zoom=10&size=300x300&maptype=road&markers=color:green%7Clabel:Start%7C<?php echo $startlatlong;?>&markers=color:red%7Clabel:Finish%7C<?php echo $endlatlong; ?>" />
                </div>

<iframe src=""http://maps.google.com/maps/api/staticmap?zoom=10&size=300x300&maptype=road&markers=color:green%7Clabel:Start%7C<?php echo $startlatlong;?>&markers=color:red%7Clabel:Finish%7C<?php echo $endlatlong; ?>"></iframe>

Any ideas appreciated.

Thanks

 
appliculture replied on at Permalink Reply
appliculture
Did you try to replace var with manual value ?

If the iframe is working then check if your var doesn't have space or special char ..
Also an iframe need some other information like width and height to be displayed correctly.http://designshack.net/articles/html/embedding-google-maps-into-a-w...
PJSAndo replied on at Permalink Reply
Thanks for the reply.

I sort of worked around it. I used a static map with link to dynamic map with following code. Still don't know why it didn't work as it was, but this is fine for my needs.

a class="popup-gmaps" href="https://www.google.com/maps/d/embed?mid=z-k-mg8oyDFg.kCEYlosJrcWc"><img src="http://maps.google.com/maps/api/staticmap?zoom=10&size=300x300&maptype=road&markers=color:green%7Clabel:Start%7C<?php echo $startlatlong;?>" /></a>
<script>
$(document).ready(function() {
    $('.popup-gmaps').magnificPopup({
        disableOn: 700,
        type: 'iframe',
        mainClass: 'mfp-fade',
        removalDelay: 160,
        preloader: false,
        fixedContentPos: false
    });
});
</script>