examples/yandex.html

<html>
<head>
	<title>L.Yandex example</title>
	<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
	<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
	<script src="https://api-maps.yandex.ru/2.1/?lang=en_RU&amp;apikey=<your API-key>" type="text/javascript"></script>
	<script src="../layer/tile/Yandex.js"></script>
	<style>
		.leaflet-bottom { bottom: 20px }
		.leaflet-control-attribution { margin-bottom: -10px !important }
	</style>
</head>
<body>

<div style="width:100%; height:100%" id="map"></div>

<script>
	var center = [67.6755, 33.936];

	var map = L.map('map', {
		center: center,
		zoom: 10,
		zoomAnimation: true
	});

	map.attributionControl
		.setPosition('bottomleft')
		.setPrefix('');

	function traffic () {
		// https://tech.yandex.ru/maps/jsbox/2.1/traffic_provider
		var actualProvider = new ymaps.traffic.provider.Actual({}, { infoLayerShown: true });
		actualProvider.setMap(this._yandex);
	}

	var baseLayers = {
		'Yandex map': L.yandex() // 'map' is default
			.addTo(map),
		'Yandex map + Traffic': L.yandex('map')
			.on('load', traffic),
		'Yandex satellite':  L.yandex({ type: 'satellite' }), // type can be set in options
		'Yandex hybrid':     L.yandex('hybrid'),
		'OSM': L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
			attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
		})
	};

	var overlays = {
		'Traffic': L.yandex('overlay')
			.on('load', traffic)
        };

	L.control.layers(baseLayers, overlays, {collapsed: false}).addTo(map);
	var marker = L.marker(center, { draggable: true }).addTo(map);
	map.locate({ setView: true, maxZoom: 14 })
		.on('locationfound',function (e) {
			marker.setLatLng(e.latlng);
		});
</script>
 
</body>
</html>