Question

我正在尝试通过弹出窗口在[传单]中添加更多城市，但并非所有指针都在一帧中添加。我应该怎么做才能解决这个问题？问题1：为什么指针和位置没有同时显示？

这是我打算做的。我想以1个单帧显示所有地图标记，而不是添加图像。

[这里是img：所有指针都添加在美国，但不在前面。

<!DOCTYPE html>
<html>
<head>
	
	<title>Layers Control Tutorial - Leaflet</title>

	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	
	<link rel="shortcut icon" type="image/x-icon" href="docs/images/favicon.ico" />

    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.4.0/dist/leaflet.css" integrity="sha512-puBpdR0798OZvTTbP4A8Ix/l+A4dHDD0DGqYW6RQ+9jxkRFclaxxQb/SJAWZfWAkuyeQUytO7+7N4QKrDh+drA==" crossorigin=""/>
    <script src="https://unpkg.com/leaflet@1.4.0/dist/leaflet.js" integrity="sha512-QVftwZFqvtRNi0ZyCtsznlKSWOStnDORoefr1enyq5mVL4tmKB3S/EnC3rRJcxCPavG10IcrVGSmPh6Qw5lwrg==" crossorigin=""></script>


	<style>
		html, body {
			height: 100%;
			margin: 0;
		}
		#map {
			width: 1350px;
			height: 800px;
		}
	</style>

	
</head>
<body>

<div id='map'></div>

<script>
	var cities = L.layerGroup();
	
	L.marker([39.61, -105.02]).bindPopup('This is Littleton, CO.').addTo(cities),
	L.marker([39.74, -104.99]).bindPopup('This is Denver, CO.').addTo(cities),
	L.marker([39.73, -104.8]).bindPopup('This is Aurora, CO.').addTo(cities),
	L.marker([39.77, -105.23]).bindPopup('This is Golden, CO.').addTo(cities);
	L.marker([39.138582, 254.168701]).bindPopup('Colorado').addTo(cities),
	L.marker([41.817992, 272.346911]).bindPopup('Gorgeous').addTo(cities),
	L.marker([41.839006, 272.347711]).bindPopup('Rego Park').addTo(cities),
	L.marker([41.240081, -120.715021]).bindPopup('California Modoc National Forest, Alturas').addTo(cities),
	L.marker([26.995709, -82.165627]).bindPopup('Florida').addTo(cities);


	var mbAttr = 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' +
			'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
			'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
		mbUrl = 'https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw';

	var grayscale   = L.tileLayer(mbUrl, {id: 'mapbox.light', attribution: mbAttr}),
		streets  = L.tileLayer(mbUrl, {id: 'mapbox.streets',   attribution: mbAttr});

	var map = L.map('map', {
		center: [39.095963, 260.859375],
		zoom: 5,
		layers: [streets, cities]
	});

	var baseLayers = {
		"Grayscale": grayscale,
		"Streets": streets
	};

	var overlays = {
		"Cities": cities
	};

	L.control.layers(baseLayers, overlays).addTo(map);
</script>



</body>
</html>

如何使地图指针固定在一帧中？

0 个答案: