基于Lealfet.js展示Turf.js生成的平滑曲线实践
// 引入Leaflet和Turf库
<script src='https://unpkg.com/leaflet@1.7.1/dist/leaflet.js'></script>
<script src='https://unpkg.com/@turf/turf@6.5.0/turf.min.js'></script>
// 创建地图并设置视图
var map = L.map('mapid').setView([51.505, -0.09], 13);
// 添加地图层
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 19,
attribution: '© OpenStreetMap contributors'
}).addTo(map);
// 创建一个平滑曲线的点数组
var points = [
[-0.09184, 51.5032],
[-0.08705, 51.50682],
[-0.08822, 51.50956],
// ... 更多点
[-0.07498, 51.50941]
];
// 使用Turf.js的turf.smoothFuntion来平滑化点集
var smoothed = turf.smooth(points, 0.0005, true);
// 将平滑后的曲线添加到地图上
L.polyline(smoothed.geometry.coordinates, {color: 'red'}).addTo(map);
这段代码展示了如何使用Leaflet和Turf.js创建一个地图,并在其上展示一个由Turf.js平滑处理过的点集生成的曲线。平滑处理的目的是为了减少曲线的弯曲和噪声。
评论已关闭