百度地图-线轨迹图层
代码如下：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>MapVGL</title>
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<style>
html,
body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
#map_container {
width: 100%;
height: 100%;
margin: 0;
}
</style>
<script src="//api.map.baidu.com/api?v=1.0&type=webgl&ak=1XjLLEhZhQNUzd93EjU5nOGQ"></script>
<script src="//mapv.baidu.com/build/mapv.min.js"></script>
<script src="static/common.js"></script>
<script src="https://code.bdstatic.com/npm/mapvgl@1.0.0-beta.131/dist/mapvgl.min.js"></script>
</head>
<body>
<div id="map_container"></div>
<script>
/* global BMapGL */
/* global mapv */
/* global mapvgl */
/* global initMap */
/* global purpleStyle */
var map = initMap({
tilt: 50,
heading: 0,
center: [108.369327,22.821705],
zoom: 13,
//style: purpleStyle
});
var view = new mapvgl.View({
map: map
});
view.startAnimation();
vardata=[{geometry:{type:"LineString",coordinates:[[108.320459,22.834495],[108.327933,22.819573],[108.375651,22.817441],[108.419344,22.818507],[108.461888,22.823303],[108.482585,22.823836],[108.535477,22.81904]]}},{geometry:{type:"LineString",coordinates:[[108.418194,22.676657],[108.437742,22.736401],[108.442341,22.790788],[108.442341,22.790788],[108.375651,22.885647],[108.34518,22.889376],[108.306661,22.865402]]}}];
var lineLayer = new mapvgl.LineTripLayer({
trailLength: 21,
color: 'rgb(0, 255, 255)'
});
view.addLayer(lineLayer);
lineLayer.setData(data);
</script>
</body>
</html>配置文档：
https://mapv.baidu.com/gl/docs/LineTripLayer.html图层代码：
var layer = new mapvgl.LineTripLayer({ color: 'rgba(50, 50, 200, 1)', step: 0.3, trailLength: 20, startTime: 0, endTime: 100, data: [{ geometry: { type: 'LineString', coordinates: [ [116.394191, 39.91334], [116.417259, 39.913672] ] } }]}); |
|---|
options属性
color
解释：颜色，同css颜色
类型：string
默认值：’rgba(255, 5, 5, 1)’
startTime
解释：动画开始时间
类型：Number
默认值：0
endTime
解释：动画结束时间
类型：Number
默认值：data的长度
step
解释：执行每次动画的步长
类型：Number
默认值：0.1
trailLength
解释：动画的拖尾时长
类型：Number
默认值：3
data内容
数据格式内容：
[{
geometry: {
type: 'LineString',
coordinates: [
[116.394191, 39.91334],
[116.417259, 39.913672]
]
}
}]本文参与 腾讯云自媒体同步曝光计划，分享自微信公众号。
原始发表：2021-09-17，如有侵权请联系 cloudcommunity@tencent.com 删除
本文分享自 传输过程数值模拟学习笔记 微信公众号，前往查看
如有侵权，请联系 cloudcommunity@tencent.com 删除。
本文参与 腾讯云自媒体同步曝光计划 ，欢迎热爱写作的你一起参与！
评论
登录后参与评论
推荐阅读
目录
腾讯云开发者
