Leaflet.js设置tileSize为1024px时不同缩放级别下部分必要瓦片未加载的问题求助

我想要使用尺寸为1024x1024 px的瓦片，但在Leaflet中打开并显示地图时，不同缩放级别下无法加载所有需要的瓦片。

举个简单的例子：

从不同缩放级别可以看到，只有缩放级别0显示正常，其他缩放级别的瓦片都缺失了。

以下是我的代码：

<!DOCTYPE html>
<html style="height: 100%; margin: 0;">
<head>
<title>MapViewer</title>
<meta name = "viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css"
integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A=="
crossorigin=""/>
<!-- Make sure you put this AFTER Leaflet's CSS -->
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"
integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA=="
crossorigin=""></script>
</head>
<body style = "height: 100%; margin: 0;">
<div id="map" style="width: 100%; height: 100%; background: #FFFFFF; margin: 0;"></div>
<script type="text/javascript">
var maxZoomLevel = 2;
var map = L.map('map').setView([0, 0], 1);
L.tileLayer('map/{z}/{x}/{y}.jpg', {minZoom: 0,maxZoom: maxZoomLevel,
continuesWorld: false,
noWrap: true,
tileSize: 1024}).addTo(map);
</script>
</body>
</html>

有没有人遇到过类似的问题？

备注：内容来源于stack exchange，提问作者dba12