Question

在我的表单中，我有标签类型Togglable tabs前端Bootstrap。每次单击选项卡，我都需要显示地图，不幸的是，这些地图以灰色部分显示。使用的代码：

@Using Ajax.BeginForm("Index", New AjaxOptions() With { _
                                                        .UpdateTargetId = "AnswerSN",
                                                        .HttpMethod = "POST"
                                                      })
@<Script>
    init("tab1");

    function ChangeDiv(whoDiv) {
        if (whoDiv.href.indexOf("#tab1") != -1) {
            $(".mezzouno").attr("id", "old-map")
            $(".flottauno").attr("id", "basic-map")
            clearTimeout(TimeR)
            init("tab1");
        } else if (whoDiv.href.indexOf('#mezzo1') != -1) {
            $(".flottauno").attr("id", "old-map")
            $(".mezzouno").attr("id", "basic-map")
            clearTimeout(TimeR)
            init("mezzo1");
        }
    }

    var TimeR;

    function Fleet() {
        var updateUrl = '@Url.Action("FleetVb", "Home")';

        $.ajax({
            url: updateUrl,
            success: function (result) {
                FleetJs(result);
            },
            cache: false
        });

        clearTimeout(TimeR)
        TimeR= window.setTimeout("Fleet()", 60000);
    }

    function Vehicle() {
        var updateUrl = '@Url.Action("PointVb", "Home")';

        $.ajax({
            url: updateUrl,
            success: function (result) {
                initialize(result);
            },
            cache: false
        });

        clearTimeout(TimeR)
        TimeR= window.setTimeout("Vehicle()", 60000);
    }

    function init(whoDiv) {
        var myOptions = {
            zoom: 8,
            center: new google.maps.LatLng(41.895122, 12.481627),
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            panControl: true,
            panControlOptions: {
                position: google.maps.ControlPosition.RIGHT_TOP
            },
            zoomControlOptions: {
                style: google.maps.ZoomControlStyle.SMALL
            },
            streetViewControl: false,
            scaleControl: true
        };

        map = new google.maps.Map(document.getElementById("basic-map"), myOptions);
        google.maps.event.trigger(map, 'resize');

        if (whoDiv== 'tab1') {
            window.setTimeout("ProvaFlotta()", 1000);
        } else if (whoDiv== 'mezzo1') {
            window.setTimeout("Prova()", 1000);
        }
    }
</script>

@<div id="AnswerSN" style="position:absolute; top:100px"></div>

End Using

我在哪里处理选项卡的单击并在其下面并检查地图的ID？不幸的是，我明白了：

Map

你可以调出完整的地图而不是灰色吗？

Answer 1

放大浏览器窗口，地图变得可见，单击选项卡我看到另一个地图，背面为灰色并且可以看到窗口加宽。

如何让它始终可见？似乎有些事情发生冲突......

帮助

Answer 2

然后， resize我使用另一个Boolean类型的变量插入了两个函数“Fleet（）”和“Vehicle（）”，因此调整大小只进行一次。对这两个函数的调用由“init（）”执行，计时器为200毫秒，因此映射可能不会显示为灰色。

再次感谢你。

地图显示部分灰色

2 个答案: