SOURCE

<div id="mapid" style="width:100%; height: 100%;">
</div>

<script>
	var mymap = L.map('mapid').setView([51.505, -0.09], 13);
	
L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
		maxZoom: 18,
		attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' +
			'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
			'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
		id: 'mapbox/streets-v11',
		tileSize: 512,
		zoomOffset: -1
	}).addTo(mymap);

var latlngsB = [
          [
            [
                51.525833847122584,
              -0.5328369140625
              
            ],
            [
              51.525833847122584  ,
              0.05218505859375
              
            ],
            [
               51.7151177895987 ,
              0.05218505859375
              
            ],
            [
               51.7151177895987 ,
              -0.5328369140625
              
            ],
            [
              51.525833847122584  ,
              -0.5328369140625
              
            ]
          ]
        ];
var polygonB = L.polygon(latlngsB, {color: 'red'}).addTo(mymap);
polygonB.on('click', function(){
    console.log('da')
})
var latlngs =  [
          [
            [
                51.582189932691456,
              -0.35980224609374994,
              
            ],
            [
                51.582189932691456,
              -0.1043701171875,
              
            ],
            [
                51.670851810144654,
              -0.1043701171875,
              
            ],
            [
                51.670851810144654,
              -0.35980224609374994,
              
            ],
            [
                51.582189932691456,
              -0.35980224609374994
              
            ]
          ]
        ]
var polygon = L.polygon(latlngs, {color: 'red'}).addTo(mymap);
polygon.on('click', function(){
    console.log('xiao')
})

</script>

html,body{
    width: 100%;
    height: 100%;
    padding: 0px;
    margin: 0px;
}