如何解决如何在网站更新时自动更新 Mapbox
我希望向 Mapbox 添加标记。这些标记将包含指向其他网站的链接，我希望在网站更新其文章时自动在地图上绘制实时数据，并带有指向网站的链接 + 文章中所说内容的缩短版本。有人可以分享任何提示吗？
解决方法
你能分享一下你到目前为止做了什么吗？ 你的问题很笼统。因此，我只能建议不要在每次更改时更新整个网站，而是使用 jQuery 并逐步更新更改。
在 Mapbox 中，您可以添加图层。这些图层具有数据源。当您更新图层的数据源（已创建）时，显示的数据将随之更新。
请看这个添加周期性更新层的例子：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Add live realtime data</title>
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<script src="https://api.mapbox.com/mapbox-gl-js/v2.0.0/mapbox-gl.js"></script>
<link href="https://api.mapbox.com/mapbox-gl-js/v2.0.0/mapbox-gl.css" rel="stylesheet" />
<style>
body { margin: 0; padding: 0; }
#map { position: absolute; top: 0; bottom: 0; width: 100%; }
</style>
</head>
<body>
<div id="map"></div>
<script>
mapboxgl.accessToken = "<Access Token>";
var map = new mapboxgl.Map({
container: 'map',style: 'mapbox://styles/mapbox/streets-v11',zoom: 0
});
var url = 'https://wanderdrone.appspot.com/';
map.on('load',function () {
var request = new XMLHttpRequest();
window.setInterval(function () {
// make a GET request to parse the GeoJSON at the url
request.open('GET',url,true);
request.onload = function () {
if (this.status >= 200 && this.status < 400) {
// retrieve the JSON from the response
var json = JSON.parse(this.response);
// update the drone symbol's location on the map
map.getSource('drone').setData(json);
// fly the map to the drone's current location
map.flyTo({
center: json.geometry.coordinates,speed: 0.5
});
}
};
request.send();
},2000);
map.addSource('drone',{ type: 'geojson',data: url });
map.addLayer({
'id': 'drone','type': 'symbol','source': 'drone','layout': {
'icon-image': 'rocket-15'
}
});
});
</script>
</body>
</html>版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
