cesium实现区域贴图及加载多个gif动图

最新推荐文章于 2026-07-13 09:03:42 发布

原创

最新推荐文章于 2026-07-13 09:03:42 发布 · 1.9k 阅读

收录于

当前文章被以下社区和专栏收录：

本文介绍了如何在Cesium中使用Billboard功能加载并动态更新gif动图，以及加载GeoJSON数据并自定义样式，包括贴图、多边形和文本展示。

1、cesium加载多个gif动图

Cesium的Billboard支持单帧纹理贴图，如果能够将gif动图进行解析，获得时间序列对应的每帧图片，然后按照时间序列动态更新Billboard的纹理，即可实现动图纹理效果。为此也找到了相对于好一点的第三方库libgif能够将gif转化为一帧帧图像，正好能够满足我们的需求！！！

let gifImgList = [];
  data?.forEach((tag) => {
    let url = huangren;
    let gifDiv = document.createElement("div");
    let gifImg = document.createElement("img");

    // gif库需要img标签配置下面两个属性
    gifImg.setAttribute("rel:animated_src", url);
    gifImg.setAttribute("rel:auto_play", "1"); // 设置自动播放属性
    gifDiv.appendChild(gifImg);
    let superGif = new SuperGif({
      gif: gifImg,
    });
    gifImgList.push(superGif);
  });

  data?.forEach((tag, ind) => {
    gifImgList[ind].load(function ()

标签

#贴图