JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Примеры. Размещение карты на странице.</title>
    <!--
        Подключаем API карт
        Параметры:
          - load=package.full - основные компоненты;
	      - lang=ru-RU - язык русский.
	    Если вы используете API локально, то в URL ресурса необходимо указывать протокол в стандартном виде (http://...)
    -->
    <script src="//api-maps.yandex.ru/2.0/?load=package.full&lang=ru-RU" type="text/javascript"></script>
</head>

<body>
    <div id="map" style="width:400px; height:300px"></div>
    <input type="button" id="destroyButton" value="Удалить карту"/>
</body>

</html>

JavaScript

ymaps.ready(function() {
        var map = new ymaps.Map("map", {
            center: [59.216479755719156, 39.887253417968715],
            zoom: 12,
            behaviors: ['default', 'scrollZoom']
        });
                
        var polygon = new ymaps.Polygon([
            [[59.2192164008285, 39.823476483932176], [59.21618014179259, 39.823776891341836], [59.21674121004697, 39.83463447343408], [59.2172197609596, 39.844901969543045], [59.22076467853722, 39.844231417289336], [59.22011842556126, 39.82901256333891], [59.2192164008285, 39.823476483932176]]
        ],
        {hintContent: "Полигон-1"},
        {fillColor: '#1d74cf40'});
    
        polygon.events.add('click', function(e) {
            if (polygon.options.get('strokeWidth') === 3) {
                polygon.options.set({
                    strokeWidth: 1,
                    strokeColor: '#1d74cf',
                    fillColor: '#1d74cf40'
                });
            } else {
                polygon.options.set({
                    strokeWidth: 3,
                    strokeColor: '#ff3000',
                    fillColor: '#ffb57a'
                });
            }
        });
    
        map.geoObjects.add(polygon);
    });