腾讯地图折线折中点计算方法 - JS 示例
可以使用腾讯地图提供的'geometry' 库来实现折线的折中点计算。
具体步骤如下:
- 引入'geometry' 库
<script type='text/javascript' src='https://map.qq.com/api/js?v=2.exp&key=YOUR_KEY&libraries=geometry'></script>
- 定义折线
var path = [new qq.maps.LatLng(39.908823, 116.397470),
new qq.maps.LatLng(39.908823, 116.407470),
new qq.maps.LatLng(39.898823, 116.407470),
new qq.maps.LatLng(39.898823, 116.417470)];
var polyline = new qq.maps.Polyline({
path: path
});
- 计算折线的折中点
var midPoints = qq.maps.geometry.spherical.computeMidpoints(path);
- 将折中点添加到地图上
for (var i = 0; i < midPoints.length; i++) {
var marker = new qq.maps.Marker({
position: midPoints[i],
map: map
});
}
完整代码示例:
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<title>腾讯地图折线折中点示例</title>
<style type='text/css'>
#container {
width: 100%;
height: 500px;
}
</style>
</head>
<body>
<div id='container'></div>
<script type='text/javascript' src='https://map.qq.com/api/js?v=2.exp&key=YOUR_KEY&libraries=geometry'></script>
<script type='text/javascript'>
var map = new qq.maps.Map(document.getElementById('container'), {
center: new qq.maps.LatLng(39.908823, 116.397470),
zoom: 13
});
var path = [new qq.maps.LatLng(39.908823, 116.397470),
new qq.maps.LatLng(39.908823, 116.407470),
new qq.maps.LatLng(39.898823, 116.407470),
new qq.maps.LatLng(39.898823, 116.417470)];
var polyline = new qq.maps.Polyline({
path: path,
map: map
});
var midPoints = qq.maps.geometry.spherical.computeMidpoints(path);
for (var i = 0; i < midPoints.length; i++) {
var marker = new qq.maps.Marker({
position: midPoints[i],
map: map
});
}
</script>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/oYTY 著作权归作者所有。请勿转载和采集!