Leaflet 是否将图层和图层控件添加到自定义地图？

我正在尝试为一个游戏创建一个自定义地图，并在上面放置标记，我的地图正在工作，我的标记也在工作，但我想制作一组标记，我不知道怎么做，我尝试了该网站的示例，但没有成功，我得到了一个白色屏幕…：

这是我的代码，它在没有图层组和图层控件的情况下工作 ，有人能教我怎么做吗？谢谢

祝福在线地图
html，正文{
身高：100%；
保证金：0；
}
#地图{
宽度：5400px；
高度：5400px；
}
var map=L.map（'map'{
crs:L.crs.Simple，
最小缩放：-3
});
var yx=L.latLng；
var xy=函数（x，y）{
如果（L.Util.isArray（x））{//执行xy（[x，y]）；
返回yx（x[1]，x[0]）；
}
返回yx（y，x）；//执行xy（x，y）时；
};
var greenIcon=L.icon({
iconUrl:'leaf green.png'，
shadowUrl:'leaf shadow.png'，
图标大小：[38,95]，//图标的大小
阴影大小：[50，64]，//阴影的大小
iconAnchor:[22，94]，//对应于标记位置的图标点
shadowAnchor:[4，62]，//对阴影也一样
popupAnchor:[-3，-76]//相对于iconAnchor打开弹出窗口的点
});
var界限=[xy（0,0），xy（54005400）]；
var image=L.imageOverlay（'https://i.imgur.com/h5O086f.jpg“，边界）。添加到（映射）；
var-sol=xy（22602158）；
var mizar=xy（35082690）；
var kruegerZ=xy（13.4,56.5）；
var deneb=xy（218.7,8.3）；
L.marker（sol）.addTo（map）.bindpoop（'Donjon 1'）；
L.marker（mizar）.addTo（map）.bindpoop（'Donjon 2'）；
L.marker（kruegerZ）.addTo（map）.bindpoppopup（'Donjon 3'）；
L.marker（deneb）.addTo（map）.bindpoop（'Donjon 4'）；
map.setView（xy（40001000），0）；

@Adawong。您需要在Javascript中设置它，以便在传单中添加多个层，如下所示

layers: {
            baselayers: {                    
                topo: {
                    name: "ArcGISStreets",
                    type: "agsBase",
                    layer: "Topographic",
                    visible: true
                },
                osm: {
                    name: 'OpenStreetMap',
                    url: 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
                    type: 'xyz'
                     }
            }

}

我已经在我的Angular传单指令项目中使用了这个层，并且我创建了示例JSFIDLE来展示层是如何工作的

---

参考资料来源：

OP不使用Angular。是的，我知道，但Javascript可以作为替代。像这样，是的，请注意OP在他们的问题中已经提到了这个确切的链接。你也应该分享你说不起作用的代码，这些代码复制了你描述的问题。否则，人们将无法解释为什么它不起作用，因此您将错过一个提高技能的机会。很难理解您最终要做什么（为什么要将事情分组？同时打开/关闭它们的可见性？），并且您显示的代码不会重现“我得到一个白色屏幕”你刚才描述的问题。

layers: {
            baselayers: {                    
                topo: {
                    name: "ArcGISStreets",
                    type: "agsBase",
                    layer: "Topographic",
                    visible: true
                },
                osm: {
                    name: 'OpenStreetMap',
                    url: 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
                    type: 'xyz'
                     }
            }