I am trying to render on a leaflet map an ArcGIS vector layer and a satellite image layer using the [Esri Leaflet Vector Tile plugin][1]. The issue is that when I add those two layers the labels of the vector layer disapear underneath the satellite image after we pan or zoom in the map.
For reference I am trying to load this vector tile layer https://www.arcgis.com/home/webmap/viewer.html?webmap=28f49811a6974659988fd279de5ce39f on top of the world imagery map.
Code exampe:
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Esri Vector Layer</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/leaflet/dist/leaflet.css"/>
<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
<!-- Load Mapbox GL -->
<link rel="stylesheet" href="https://unpkg.com/mapbox-gl/dist/mapbox-gl.css"/>
<script src="https://unpkg.com/mapbox-gl/dist/mapbox-gl.js"></script>
<!-- Esri Leaflet and Esri Leaflet Vector -->
<script src="https://unpkg.com/esri-leaflet/dist/esri-leaflet.js"></script>
<script src="https://unpkg.com/esri-leaflet-vector/dist/esri-leaflet-vector.js"></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>
var map = L.map('map').setView([ 40.706, -73.926], 14);
L.tileLayer('https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}.png').addTo(map);
L.esri.Vector.layer('28f49811a6974659988fd279de5ce39f').addTo(map);
</script>
</body>
</html>
