Google Map Infowindow上的弹出链接

时间:2015-05-22 07:12:26

标签: jquery google-maps popup infowindow

基本上,我想在Google Map infowindow的contentstring中找到一个链接,该链接一旦点击就会打开一个带有表单的弹出窗口。

我曾尝试使用fancybox,但它无法正常工作。

经过一些研究后我发现,因为地图在window.load之后加载,这就是为什么花式框不能正常工作。

有没有人知道如何完成这项任务?

的JavaScript

<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script>

var geocoder;
var ws_wsid = 'afca921c9778417e8dc16a8236d1f079';
var ws_address = "8052 WILLARD ST,Burnaby";
var ws_width = '100%';
var ws_height = '400';
var ws_layout = 'vertical';
var ws_commute = 'true';
var ws_transit_score = 'true';
var ws_map_modules = 'all';
var address = "8052 WILLARD ST,Burnaby";



function initialize() {
var fenway = new google.maps.LatLng(49.196640800000000, -122.961060100000000)
var mapOptions = {
center: fenway,
zoom: 14,
mapTypeId: google.maps.MapTypeId.ROADMAP
};


map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
var contentString = '<div><a class="fancybox-inline" href="#request_form_pop">Request of showing this property</a></div>';
var infowindow = new google.maps.InfoWindow({
  content: contentString
});

var marker = new google.maps.Marker({
  position: fenway,
  map: map,
  title: ''

});


infowindow.open(map,marker);
google.maps.event.addListener(marker, 'click', function() {
 });

var panoramaOptions = {
position: fenway,
pov: {
  heading: 34,
  pitch: 10
 }
};
panorama = new   google.maps.StreetViewPanorama(document.getElementById('pano'), panoramaOptions);
map.setStreetView(panorama);


}

google.maps.event.addDomListener(window, 'load', initialize);
</script>


HTML

<div class="fancybox-hidden" style="display: none;">
    <div id="request_form_pop">
            <p>hello</p>
            [...]A Form[...]
        <a href="" onClick="parent.jQuery.fancybox.close();">Close window</a>
    </div>
    </div>



非常感谢任何形式的帮助或想法。

0 个答案:

没有答案