我点击第二次加载地图

Question

我想在Kendo UI窗口上显示我的开放街道地图。在第一次点击地图显示，但之后它不加载。即使我使用谷歌地图相同的结果。在谷歌搜索后，我发现我们不能多次初始化地图。我尝试过不同的方式，但它不起作用。可能是我的做法并不好。这是'我的代码

var data=' ';

function createMap() {
    data = $("#map").kendoMap({
        center: [23.7099, 90.4071],
        zoom: 15,
        layers: [
            {
                type: "tile",
                urlTemplate: "http://#= subdomain #.tile2.opencyclemap.org/transport/#= zoom #/#= x #/#= y #.png",
                subdomains: ["a", "b", "c"],
                attribution: "&copy; <a href='http://osm.org/copyright'>OpenStreetMap</a>."
            }
        ]
    });   
}

function showMap(e) {
    e.preventDefault();
    var wnd = $("#Map").data("kendoWindow");
    createMap();
    wnd.content(data);
    wnd.center().open();

}
@(Html.Kendo().Window().Name("Map")
  .Title("<span class='glyphicon glyphicon-map-marker'></span> Map of the road")
  .Visible(false)
  .Modal(true)
  .Draggable(true)
  .Width(635)
)

用户点击时触发ShowMap

Answer 1

你必须重绘地图。您可以使用以下代码执行此操作：

google.maps.event.trigger(map, 'resize');

这样可以刷新地图，解决问题。

Answer 2

请在功能结束时尝试此操作

$("#map").data("kendoMap").resize();