In this example, the map is created when the "Show map" button is clicked.
At first, an empty div container is placed on the page. The bind() function is used for the "button" element to assign a handler for the click event, which creates the map and puts it in the specified container when called.
If the map has already been created when the button is clicked, the destroy() method is called and it destroys the map.
{% list tabs %} - index.html ```html``` - request_map.js ```js // As soon as the API is loaded and DOM is ready, let's perform the initialization ymaps.ready(init); // Initialization and destruction of the map when the button is clicked. function init() { var myMap; $("#toggle").bind({ click: function () { if (!myMap) { myMap = new ymaps.Map( "map", { center: [55.010251, 82.958437], // Novosibirsk zoom: 9, }, { searchControlProvider: "yandex#search", } ); $("#toggle").attr("value", "Hide map"); } else { myMap.destroy(); // Destructor of the map myMap = null; $("#toggle").attr("value", "Show the map again"); } }, }); } ``` {% endlist %}