Карта не загружается при втором щелчке мыши

Я хочу показать открытую карту улиц в окне Kendo UI. При первом клике карта отображается, но после этого она не загружается. Даже если я использую google map тот же результат. После поиска в google, я обнаружил, что мы не можем инициализировать карту более одного раза. Я пробовал по-разному, но это не работает. Может быть, мой подход не был хорошим. Вот мой код

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 огонь на пользователь нажмите

Когда я нажимаю первый раз
Когда я нажимаю больше, чем один

2 ответа

  1. Вы должны перерисовать карту. Это можно сделать с помощью следующего кода:

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

    Это позволит обновить карту, устраняя проблему.

  2. Пожалуйста, попробуйте это в конце функции

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