GMAP显示了一种在jQuery的对话框后，第四一个负载 [英] gmap shows one fourth after one load in jquery dialog box

问题描述

我试图表现出经度和纬度的基础，但在 Repeater控件的数据源。这里是我的code可在GMAP

I am trying to show gmap on the basis of longitude and latitude which are available in repeater control data source .here is my code

<script src="http://maps.google.com/maps/api/js?key=myapikey&sensor=false"
    type="text/javascript"></script>
<script type="text/javascript">
    $('document').ready(function () {
        $('.mapicon').click(function (e) {              
            init($(this).next('.hdnLatitude').val(), $(this).nextAll('.hdnLongitude').val(), $(this).nextAll('.hdnInfoWindow').val());
            $("#popup_container").dialog({ modal: true }, { border: 10 }, { width: 513 }, { height: 450 });
        });
    });
</script>

这是init方法，它负载GMAP

and this is the init method which load gmap in

<script type="text/javascript">

        function init(hdnLatitude, hdnLongitude, hdnInfoWindow) {
            //            alert(hdnLatitude);
            //            alert(hdnLongitude);

            var map = new google.maps.Map(document.getElementById('map'), {
                zoom: 10,
                center: new google.maps.LatLng(hdnLatitude, hdnLongitude),
                mapTypeId: google.maps.MapTypeId.ROADMAP
            });

            var infowindow = new google.maps.InfoWindow();

            var marker, i;

            var image = 'images/map-icon.gif';
            var marker = new google.maps.Marker({
                position: new google.maps.LatLng(hdnLatitude, hdnLongitude),
                map: map,
                icon: image
            });

            var infoWindow = new google.maps.InfoWindow();

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

        }
    </script>

和这是HTML

<div id="popup_container" style="display: none;">
        <div id="map" style="width: 500px; height: 400px;">
        </div>
    </div>

当 mapicon 第一次点击即可GMAP显示正确，但在每次调用弹出打开后，但地图显示四分之一，标记显示不正确的问题。

the problem is when first time click on mapicon then gmap appears correctly but after that in every call popup opens but map appear one fourth and marker is not appearing correctly.

编辑

Unfotunately我没有得到一个答案或可能是我的问题是不清楚，因此用户。

Unfotunately i am not getting a single answer or may be possible that my question is not clear to SO users.

我做了一个测试页面，您可以检查什么确切的问题。

I have made a test page where you can check that whats the exact problem.

这是第一次点击它的展示完美的地图，当你关闭弹出一次，并在 GMAP 再次单击则弹出打开，但 GMAP 显示四分之一。

on first click its shows perfect map but when you close popup once and again click on gmap then popup opens but gmap shows one fourth.

这是测试页面的链接

推荐答案

最后的问题通过对话框打开方法的一些变化和调整解决。

Finally problem resolved by making some changes or adjustment in dialog open method

开始使用 $（＃popup_container）对话框（{的AutoOpen：假}）; 而不是

=风格显示：无，不显示在页面加载弹出。

style=display:none for not showing popup on page load .

第二个变化我做了使用这个调用打开方法打开弹出

second change i made open the popup using this call to open method

$('#popup_container').dialog('open');

，之后我称之为的init（）法

和问题解决。

下面是最后的的document.ready 法

<script type="text/javascript">
        $('document').ready(function () {
            $("#popup_container").dialog({ autoOpen: false });
            $('#gmap').click(function () {
                $('#popup_container').dialog('open');
                $("#popup_container").dialog({ modal: true }, { border: 10 }, { width: 500 }, { height: 340 });
                init();
            });
        });
    </script>

这篇关于GMAP显示了一种在jQuery的对话框后，第四一个负载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！