Question

我在我正在构建的网站的首页上使用jQuery Vector Map（http://jqvmap.com/）。

此特定地图需要将其放入的div以内联大小。

为了使这个地图响应，我设置了以下代码：

Html占位符：

<div id="map" style="width: 674px;height: 384px;"></div>

脚本：

<script src="{{ asset('components/jqvmap/jqvmap/jquery.vmap.min.js') }}"></script>
    <script src="{{ asset('components/jqvmap/jqvmap/maps/jquery.vmap.usa.js') }}">       </script>
    <script>
        function createMap() {
            var mapWidth = document.getElementById("map").clientWidth;
            var mapHeight = mapWidth * .55;

            document.getElementById("map").style.width = mapWidth + 'px';
            document.getElementById("map").style.height = mapHeight + 'px';

            jQuery('#map').vectorMap({ 
                map: 'usa_en',
                backgroundColor: null,
                borderColor: '#818181',
                borderOpacity: 0.85,
                borderWidth: 1,
                color: '#f4f3f0',
                enableZoom: true,
                hoverColor: '#c9dfaf',
                hoverOpacity: null,
                normalizeFunction: 'linear',
                scaleColors: ['#b6d6ff', '#005ace'],
                selectedColor: '#c9dfaf',
                selectedRegion: null,
                showTooltip: true,
                onRegionClick: function(element, code, region)
                {
                    $(location).attr('href','{{ route("search") }}?state='+ code);
                }
            });

        }

        $(document).ready(function() {
            createMap();
        });
        $(window).resize(function(){        
            createMap();
        });
    </script>

正如您所看到的，我在页面加载时运行JS createMap（）函数，它开始设置div的大小以确保它正确匹配。

然后，每次调整页面大小时，都会再次创建地图，以使其适合自己。

我不是那么强大的JS，更多的是后端开发人员，所以我无法弄清楚为什么这在IE中表现不佳。

基本上它有时会正确加载，但其他人则会在IE中创建非常大的地图。

Answer 1

“我...更多的是后端开发人员，所以我无法弄清楚为什么这在IE中表现得很糟糕。”别担心，其他任何人都不能担心：）

一些googlin'显示很多人报告了clientWidth特别是IE8中的错误/功能失调。

也许试试这个：

var mapWidth = jQuery("#map").width()

而不是：

var mapWidth = document.getElementById("map").clientWidth;

有人可以帮助我理解为什么这个Javascript可以在任何地方工作但IE？

1 个答案: