cesium加载Draco几何压缩数据

1.1 处理流程

  • 利用3d-tiles-tools 或gltf-pipeline 压缩glb 或b3dm。
  • cesium 直接加载Draco压缩后的数据。

1.2 遇见的问题

报错找不到draco_decoder.wasm,无法解压数据。

cesium包里有这个文件,但是vue项目中找不到。那大概率是webpack的问题。

接下来看我的 vue.config.js文件。

复制代码
plugins: [
            new CopyWebpackPlugin({ patterns: [{ from: path.join(cesiumSource, cesiumWorkers), to: 'Workers' }] }),
            new CopyWebpackPlugin({ patterns: [{ from: path.join(cesiumSource, 'Assets'), to: 'Assets' }] }),
            new CopyWebpackPlugin({ patterns: [{ from: path.join(cesiumSource, 'Widgets'), to: 'Widgets' }] }),
            new CopyWebpackPlugin({ patterns: [{ from: path.join(cesiumSource, 'ThirdParty/Workers'), to: 'ThirdParty/Workers' }] })
]

可以看到只处理了ThirdParty/Workers 文件的引用,但是ThirdParty里其他文件没有处理,而draco_decoder.wasm 恰好在这次选项中。那就更改配置。

复制代码
        plugins: [
            new CopyWebpackPlugin({ patterns: [{ from: path.join(cesiumSource, cesiumWorkers), to: 'Workers' }] }),
            new CopyWebpackPlugin({ patterns: [{ from: path.join(cesiumSource, 'Assets'), to: 'Assets' }] }),
            new CopyWebpackPlugin({ patterns: [{ from: path.join(cesiumSource, 'Widgets'), to: 'Widgets' }] }),
            new CopyWebpackPlugin({ patterns: [{ from: path.join(cesiumSource, 'ThirdParty/Workers'), to: 'ThirdParty/Workers' }] }),
            new CopyWebpackPlugin({
                patterns: [{
                        from: path.join(cesiumSource, 'ThirdParty'),
                        to: 'ThirdParty',
                        // 只复制 ThirdParty 下的 Workers 目录之外的文件
                        filter: (file) => {
                            return !file.includes('Workers');
                        }
                    },

                ]
            }),]

此时可以加载Draco压缩数据

相关推荐
O败者食尘D6 分钟前
【Vue2】结合chrome与element-ui的网页端条码打印
前端·vue.js·chrome
橘颂TA1 小时前
【C++】C++11特性的介绍和使用(第三篇)
前端·c++·算法·c++11
GISer_Jing2 小时前
50道JavaScript基础面试题:从基础到进阶
开发语言·javascript·ecmascript
爷_7 小时前
字节跳动震撼开源Coze平台!手把手教你本地搭建AI智能体开发环境
前端·人工智能·后端
charlee449 小时前
行业思考:不是前端不行,是只会前端不行
前端·ai
Amodoro10 小时前
nuxt更改页面渲染的html,去除自定义属性、
前端·html·nuxt3·nuxt2·nuxtjs
Wcowin10 小时前
Mkdocs相关插件推荐(原创+合作)
前端·mkdocs
伍哥的传说11 小时前
CSS+JavaScript 禁用浏览器复制功能的几种方法
前端·javascript·css·vue.js·vue·css3·禁用浏览器复制
lichenyang45311 小时前
Axios封装以及添加拦截器
前端·javascript·react.js·typescript
Trust yourself24311 小时前
想把一个easyui的表格<th>改成下拉怎么做
前端·深度学习·easyui