Javascript OpenLayers中的卫星视图-如何设置？

是否可以将卫星视图添加到OpenLayers

这是我初始化OpenLayers的方法：

setupMap() {
                    this.map = new OpenLayers.Map("mapdiv");
                    this.map.addLayer(new OpenLayers.Layer.OSM(
                        "OpenStreetMap", [
                            "https://a.tile.openstreetmap.org/${z}/${x}/${y}.png",
                            "https://b.tile.openstreetmap.org/${z}/${x}/${y}.png",
                            "https://c.tile.openstreetmap.org/${z}/${x}/${y}.png"
                        ]))

                    var lonLat = new OpenLayers.LonLat(9.5788, 48.9773).transform(
                        new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
                        this.map.getProjectionObject() // to Spherical Mercator Projection
                    );
                    var zoom = 11;
                    this.map.setCenter(lonLat, zoom);
                }

我试过了，但它说

a是空的

：

            setupMap() {
                this.map = new OpenLayers.Map("mapdiv");

                this.map.addLayer(new OpenLayers.Layer.XYZ({
                    attributions: ['Powered by Esri',
                        'Source: Esri, DigitalGlobe, GeoEye, Earthstar Geographics, CNES/Airbus DS, USDA, USGS, AeroGRID, IGN, and the GIS User Community'],
                    attributionsCollapsible: false,
                    url: 'https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}',
                    maxZoom: 23
                }))

                var lonLat = new OpenLayers.LonLat(9.5788, 48.9773).transform(
                    new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
                    this.map.getProjectionObject() // to Spherical Mercator Projection
                );
                var zoom = 11;
                this.map.setCenter(lonLat, zoom);
            },

错误

TypeError:a为空
格式http://127.0.0.1:8000/static/main/openlayers/OpenLayers.js:59
获取URLhttp://127.0.0.1:8000/static/main/openlayers/OpenLayers.js:608
列队法http://127.0.0.1:8000/static/main/openlayers/OpenLayers.js:1351
触发事件http://127.0.0.1:8000/static/main/openlayers/OpenLayers.js:138
画http://127.0.0.1:8000/static/main/openlayers/OpenLayers.js:486
画http://127.0.0.1:8000/static/main/openlayers/OpenLayers.js:488
initGriddedTileshttp://127.0.0.1:8000/static/main/openlayers/OpenLayers.js:514
移动到http://127.0.0.1:8000/static/main/openlayers/OpenLayers.js:502
移动到http://127.0.0.1:8000/static/main/openlayers/OpenLayers.js:190
设置中心http://127.0.0.1:8000/static/main/openlayers/OpenLayers.js:184
设置图http://127.0.0.1:8000/dashboard/?tab=realestates:2997
安装http://127.0.0.1:8000/dashboard/?tab=realestates:2373
VueJS 7
http://127.0.0.1:8000/dashboard/?tab=realestates:2250
vue.js:1897:15
VueJS 10
http://127.0.0.1:8000/dashboard/?tab=realestates:2250

OpenLayers 2 XYZ语法类似于OSM，但您为

属性（单数）、
numZoomLevels
（当缩放级别从0开始时，它比OpenLayers 3中的
maxZoom
大1）和标准球形墨卡托OSM兼容平铺网格添加了选项

            this.map.addLayer(new OpenLayers.Layer.XYZ(
                "Satellite", [
                    "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/${z}/${y}/${x}"
                ], {
                    attribution: "Powered by Esri. " + 
                        "Source: Esri, DigitalGlobe, GeoEye, Earthstar Geographics, CNES/Airbus DS, USDA, USGS, AeroGRID, IGN, and the GIS User Community",
                    numZoomLevels: 24,
                    sphericalMercator: true
                }))

            this.map.addLayer(new OpenLayers.Layer.XYZ(
                "Satellite", [
                    "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/${z}/${y}/${x}"
                ], {
                    attribution: "Powered by Esri. " + 
                        "Source: Esri, DigitalGlobe, GeoEye, Earthstar Geographics, CNES/Airbus DS, USDA, USGS, AeroGRID, IGN, and the GIS User Community",
                    numZoomLevels: 24,
                    sphericalMercator: true
                }))