リーフレットにESRIタイルレイヤーがロードされない理由を理解するのに役立ちますか? OpenLayersに読み込まれ、もちろんESRI JS APIを使用していますが、リーフレットを使用したいと考えています。ESRI TileLayerが標準ではない0ズームがリーフレットにロードされない
これは、タイルレイヤURLを使用した標準リーフレット「クイックスタート」の例です。私はレイヤーとマップコンストラクタとサイズを変更して再描画するなどのマップを強制的に両方の多くのオプションを試してみたが、私はそれが仕事を得ることができない...作品とまったく同じの
<html>
<head>
<meta charset=utf-8 />
<title>Esri Leaflet Quickstart</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<!-- Load Leaflet from CDN-->
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" />
<script src="https://unpkg.com/[email protected]/dist/leaflet-src.js"></script>
<!-- Load Esri Leaflet from CDN -->
<script src="https://unpkg.com/[email protected]"></script>
<style>
body { margin:0; padding:0; }
#map { position: absolute; top:0; bottom:0; right:0; left:0; }
</style>
</head>
<body>
<div id="map"></div>
<script>
function initmap() {
map = new L.Map('map');
//var osmUrl = 'https://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}.png'; <- example from Esri-Leaflet that works fine
var osmUrl = 'https://citymaps.capetown.gov.za/agsext1/rest/services/Background_Maps/Relief_Map/MapServer/tile/{z}/{y}/{x}';
var osm = new L.esri.tiledMapLayer({url:osmUrl, noWrap: true});
map.addLayer(osm);
}
var lat = Number(18.5296);
var lng = Number(-33.9597);
var startLatLng = new L.LatLng(lat, lng);
initmap();
map.setView(startLatLng, 0);
</script>
</body>
</html>
OpenLayersを例:
<!DOCTYPE html>
<html>
<head>
<title>Tiled ArcGIS MapServer</title>
<link rel="stylesheet" href="https://openlayers.org/en/v4.1.0/css/ol.css" type="text/css">
<script src="https://openlayers.org/en/v4.1.0/build/ol.js"></script>
</head>
<body>
<div id="map" class="map"></div>
<script>
var urlRelief = 'https://citymaps.capetown.gov.za/agsext1/rest/services/Background_Maps/Relief_Map/MapServer';
var layers = [
/* new ol.layer.Tile({
source: new ol.source.OSM()
}), */
new ol.layer.Tile({
source: new ol.source.TileArcGISRest({
url: urlRelief,
projection: 'EPSG:4326',
wrapX: false
})
})
];
var map = new ol.Map({
layers: layers,
target: 'map',
view: new ol.View({
center: [2062612, -4026418],
zoom: 10
})
});
</script>
</body>
</html>
これが問題の手掛かりになるかどうかは不明ですか?私がロードしようとしているリリーフマップは、ズームレベル0で1タイルの全世界で "ズームレベル0"で始まらないようです...ズームレベル(0)で "開始"し、6x6問題の範囲をカバーするグリッド... – Cloudstako