cesium添加原生MVT矢量瓦片方案

项目中需要基于cesium接入mvt格式的服务并支持属性拾取查询,通过一系列预研测试,最后选择cesium-mvt-imagery-provider开源插件完成,关键源码信息如下:

javascript 复制代码
npm i cesium cesium-mvt-imagery-provider //安装依赖包

// 加载图层

import CesiumMVTImageryProvider from "cesium-mvt-imagery-provider";

const imageryProvider = new CesiumMVTImageryProvider({
  urlTemplate: "http://localhost:8080/testmvt/{z}/{x}/{y}.mvt",
  layerName: "layerName", // 图层名 必传
  style: feature => { // 图层样式 必传可根据条件分别设置样式
    return {
      strokeStyle: "green",
      fillStyle: "green",
      lineWidth: 1,
    };
  },
  onSelectFeature: feature => {  // 属性拾取事件
    console.log("Feature is selected");
  },
  credit: "cesium.js",
});
viewer.scene.imageryLayers.addImageryProvider(imageryProvider);
//const currentLayer = viewer.scene.imageryLayers.addImageryProvider(imageryProvider);
//currentLayer.alpha = 0.5;
相关推荐
不cong明的亚子4 小时前
web live多屏互动平台
javascript·经验分享·音视频
dsyyyyy11016 小时前
JS复习,难点,易错点总结
开发语言·javascript·ecmascript
默_笙6 小时前
🏝 Docker 就是"房地产开发":从施工图纸到小区物业的容器化指南
前端·javascript
kyriewen6 小时前
我手写了个极简版 React Router——才搞懂 v6 为什么砍了这么多 API
前端·javascript·程序员
nice先生的狂想曲9 小时前
javascript高级程序设计(六)——2026.9.5
前端·javascript
我爱写代码i10 小时前
SKAPP SK影视反编译详细教程+源码 含苹果端ipa
开发语言·javascript·ecmascript
yyt36304584110 小时前
KLineChartQuant:GLSL 的精度问题及 RTC 解法
前端·vue.js·react.js·交互·图形渲染·webgl·数据可视化
এ慕ོ冬℘゜10 小时前
前端实战:基于jQuery递归实现通用树形组织菜单(可直接复用)
前端·javascript·jquery
变与不变80611 小时前
js函数与封装详细解答
前端·javascript·vue.js
AZaLEan__12 小时前
事件循环讲解
javascript