javascript - 我想通过输入标签为传单的标记设置旋转值

我有一个类型范围为HTML的输入标签，我想使用它来设置传单标记的rotationAngle的值。另外，随着用户更改<input>的值，必须更新rotationAngle。

我也在用https://github.com/bbecquet/Leaflet.RotatedMarker
但无法使用用户输入来设置值。

我希望随着输入标签值的变化，rotationAngle继续变化。

最佳答案

您可以使用rotationAngle方法更新setRotationAngle(newAngle)

var map = L.map('map').setView([50.5, 30.5], 18);

L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
  attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

var marker = L.marker([50.5, 30.5], {
  rotationAngle: 0
}).addTo(map);

function updateAngle(input) {
  marker.setRotationAngle(input.value);
}

#map {
  position: absolute;
  top: 35px;
  left: 0;
  width: 100%;
  height: 80%
}

<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" />
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script>

<script src="https://cdn.jsdelivr.net/npm/[email protected]/leaflet.rotatedMarker.min.js"></script>


<input type="number" value="0" min="-360" max="360" onblur="updateAngle(this)">
<div id="map"></div>