<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" />
<title>Print widget | Sample | ArcGIS API for JavaScript 4.24</title>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
overflow: hidden;
}
.esri-zoom {
display: none;
}
</style>
<script>
require([
"esri/views/MapView",
"esri/Map",
"esri/layers/FeatureLayer",
"esri/layers/MapImageLayer",
"esri/layers/TileLayer",
"esri/layers/support/TileInfo",
"esri/Basemap",
"esri/widgets/LayerList",
"esri/widgets/Print",
], (
MapView,
Map,
FeatureLayer,
MapImageLayer,
TileLayer,
TileInfo,
Basemap,
LayerList,
Print
) => {
baseLayer = new TileLayer({
id: "base",
});
//baseLayer.maxScale = 0;
basemap = new Basemap({
baseLayers: [baseLayer ],
title:"base_map",
id:"base_map"
});
const map = new Map({
// basemap: "topo-vector",// basemap
basemap: basemap
});
const view = new MapView({
container: "viewDiv",
map: map,
//center: [0,0],
center: [-82.4645, 35.46453],
constraints: {
rotationEnabled: false,
lods: TileInfo.create({
spatialReference: {
wkid: 3857
},
numLODs: 10,
}).lods
},
zoom: 9,
});
const featureLayer = new FeatureLayer({
// listMode: "hide"
});
const mapImageLayer = new MapImageLayer({
});
map.add(featureLayer);
//map.add(mapImageLayer);
try{
view.when(() => {
const print = new Print({
view: view,
printServiceUrl:
});
const layerList = new LayerList({
view: view
});
view.ui.add(print, "top-right");
view.ui.add(layerList, "top-left");
});
}
catch(e){
console.log("Error is " + e);
}
});
</script>
</head>
<body class="calcite">
<div id="viewDiv"></div>
</body>
</html>
Above code prints empty pdf which has basemap tile layer, any reason or any suggestions?