高德map脉冲线数据格式

最新推荐文章于 2024-11-17 08:30:30 发布

贺今宵

最新推荐文章于 2024-11-17 08:30:30 发布

阅读量593

点赞数 9

分类专栏： map 文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/qq_51389137/article/details/135087540

版权

map 专栏收录该内容

9 篇文章

订阅专栏

 let LineData = {
    type: "FeatureCollection",
//画线坐标一定要有两个元素，才能成线
    features: [
      {
        type: "Feature",
        properties: { type: 1 },
        geometry: {
          type: "LineString",
          coordinates: [[116.417458, 39.934026]],
        },
      },
       {
         type: "Feature",
         properties: { type: 2 },
         geometry: {
          type: "LineString",
          coordinates: [
             [126.128627, 41.146943],
             [126.12425, 41.137959],
            [126.113693, 41.128908],
           ],
        },
       },
    ],
  };

  let geo = new Loca.GeoJSONSource({
    data: pLineData, //数据格式
  });

  let layer = new Loca.PulseLineLayer({
    // loca,
    // zIndex: 100000000,
    opacity: 1,
    visible: true,
    zooms: [2, 22],
  });

  console.log("geo", data);
  layer.setSource(geo);
  layer.setStyle({
    altitude: 0,
    lineWidth: 10,
    // 脉冲头颜色
    headColor: "rgb(5, 149, 108)",
    // 脉冲尾颜色
    trailColor: "rgba(0, 255, 0, 0.9)",
    // 脉冲长度，0.25 表示一段脉冲占整条路的 1/4
    interval: 0.01,
    // 脉冲线的速度，几秒钟跑完整段路
    duration: 50000,
  });
  loca.add(layer);
  loca.animate.start();