相关疑难解决方法(0)

在Firefox,WebKit和Internet Explorer中使用的窗口调整大小事件的正确(现代)方法是什么？

你可以打开/关闭两个滚动条吗？

我有一个相当复杂的地图应用程序,可以处理多个自定义标记等.我有一个名为resizeWindow的函数,我在监听器中调用它,每当屏幕更改时,映射会通过计算新边界并强制调整大小来重绘自身.它看起来像这样:

window.onresize = function(event) { fitmap(); };

并且调整大小的功能是:

function fitmap(id) {
    var coords = [];
    var newlatlng = new google.maps.LatLng(projlat, projlng);
    coords.push(newlatlng);

        for (var i=0; i<markers[id].length; i++) {
            newlatlng = new google.maps.LatLng(markers[id][i].latitude, markers[id][i].longitude);
            coords.push(newlatlng);
        }
    }   

    var bounds = new google.maps.LatLngBounds ();
    for (var i = 0, LtLgLen = coords.length; i < LtLgLen; i++) {
        bounds.extend (coords[i]);
    }
    map.fitBounds(bounds);

当我实际调整窗口大小时,这很有用.但...

我有一个菜单从窗口的右侧下来.我使用jquery.animate将该菜单移出屏幕.我将fitmap函数称为步骤过程(或仅在结束时一次),它不会重绘地图.

$('#rightSide').animate({ right:"-240px" }, { 
    duration:1000, 
    step: function(now,fx) {
        fitmap();
    } 
});

我已阅读并阅读此内容,似乎Google Maps API v3.0存在一个奇怪的问题,即如果没有实际更改,重绘不会发生.在这种情况下,我的可用窗口确实从屏幕宽度 - 菜单更改为实际全屏.但是没有重绘.

我试过google.maps.event.trigger(map,'resize'); 这也不起作用. …

我使用'display:none'在div中创建一个地图.使用谷歌地图v2,我可以将'size'参数设置为显示的div大小,但这个'size'选项在API的v3中消失了.

我怎样才能做到这一点？

我正在嵌入谷歌地图的问题,我不明白为什么加载地图不会出现,只有当我调整窗口大小时,我在stackoverflow中经历了不同的解决方案,但它们对我不起作用.

这是我的js代码:

<script>
function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: 31.554606, lng: 74.357158},
          zoom: 14
        });
 google.maps.event.addListenerOnce(map, 'idle', function() {
               google.maps.event.trigger(map, 'resize');
            });
         } 
</script>

我的div

<div id="map"></div>

当我加载应用程序时,它看起来像

在重新调整浏览器窗口之后,它看起来非常像这样

请告诉我如何解决这个问题？

我在Angular.js中使用ng-map由于某些原因,我的地图图片在整个地图的90%处显示为灰色,如下所示:

我的HTML非常简单:

<div id="map">
<map></map>
</div>

我甚至试图像这样添加CSS:

<style>
    #map{
     width: 100%;
     height: 100%;
     margin: 0;
     padding: 0;
   }
</style>

这是我的控制器:

$scope.$on('mapInitialized', function(event, map) {
  $scope.map.setCenter(new google.maps.LatLng($scope.location.latitude, $scope.location.longitude));
  $scope.setZoom(4);
}

我添加了使用ngMap的脚本.如果可能导致问题,我也删除了任何AdBlock.

编辑:google.maps.event.trigger(map,'resize'); 作品

我可以使用div中的Drupal代码打印地图.我希望这张地图出现在一个花哨的盒子里,并隐藏在网站上.我已经设法做到了(fancybox工作正常)但是地图没有正确显示 - 没有导航和地图内只有灰色空白区域(虽然有谷歌徽标).有没有人知道这里有什么问题？我想可能是ID只呈现一个元素的情况,所以它只渲染背景而其余部分被忽略,但说实话我不知道(改用类).任何建议表示赞赏 谢谢

我的代码:

<script type="text/javascript">
    $(document).ready(function() {

    $("a#inline").fancybox({
    'hideOnContentClick': true,
    'overlayColor'      : '#ccffee',
    'overlayOpacity'    : 0.8
    });
});

</script>

链接显示地图:

<a id="inline" href="#mapcontainer" >
Show Map
</a>

打印地图的实际Div(设置可见时效果很好)

<div style="display:none">
<div id="mapcontainer">
<?php print $node->content['field_maploc']['field']['items']['#children'] ?> </div></div>

PHP代码生成以下html:

<div style="width: auto; height: 400px;" id="openlayers-container-openlayers-map-auto-id-0" class="openlayers-container openlayers-container-preset-question_map"> <div style="width: auto; height: 400px;" id="openlayers-map-auto-id-0" class="openlayers-map openlayers-preset-question_map"></div> </div> 

目前的输出 -