通过CMake的方式使用Emscripten编译pcl点云项目为Webassembly

一、背景
    在做pcl点云项目时,项目代码通过c++结合pcl点云库来实现,实现点云功能。在完成项目代码后,需要将c++代码通过Emscripten编译成Webassembly字节码,其中Emscripten是一个工具链,作用是通过LLVM来编译生成asm.js、WebAssembly字节码,目的是让你能够在网页中接近最快的速度运行C和C++,并且不需要任何插件。

二、项目目标
    将包含pcl库的c++代码通过Emscripten编译成Webassembly字节码,供前端调用。

三、项目环境要求
    a)	OS:Ubuntu 18.04
    b)	PCL version:1.12.1
    c)	Emscripten version:3.1.17

四、编译流程
    a)	配置docker环境
        i.	拉取3.1.17版本的Emscripten镜像:docker pull emscripten/emsdk: 3.1.17,镜像中已经包含了Git、CMake、系统编译工具、Python2.7.x等先决工具。
        ii.	开启容器:docker run -it -v 本机挂载目录:docke挂载目录 镜像名 /bin/bash
    b)	切换到docker挂载目录,克隆pcl库以进行Emstripten编译
        git clone https://github.com/luoxuhai/pcl.git
    c)	切换到.\pcl\wasm\deps目录,开始构建pcl库
        i.手动下载pcl库的依赖文件
            1.Boost 1.80.0
       https://sourceforge.net/projects/boost/files/boost/1.80.0/ boost_1_80_0.tar.gz
            2.	Flann 1.9.1
       git clone https://github.com/luoxuhai/flann.git --depth 1 --single-branch --branch
         3.	Eigen 3.4.
       https://gitlab.com/libeigen/eigen/-/archive/3.4.0/eigen-3.4.0.zip
        ii.	对依赖库进行解压,并重命名
            1. tar -xzvf boost_1_80_0.tar.gz
 		         mv ./boost_1_80_0 ./boost
            2. unzip -o -d ./ ./eigen-3.4.0.zip
                 mv ./eigen-3.4.0 ./eigen
            3. unzip -o -d ./ ./flann-wasm.zip
                 mv ./flann-wasm ./flann
        iii. 切换到.\pcl,开始构建
            1. 构建Boost:wasm/scripts/build-boost.sh
            2. 构建Flann,wasm/scripts/build-flann.sh
            3. 构建PCL,wasm/scripts/build-pcl.sh
     d) 将自己写的cpp文件和CMakeLists.txt放在同一工程目录下,其中CMakeLists.txt是emcc进行                    cmake编译的文件,具体内容可参考
     https://github.com/luoxuhai/pcl.js/blob/master/src/bind/CMakeLists.txt
注意要根据该文件做一些修改。
    e) 开始cmake编译,依次执行
        i.	mkdir build
        ii.	cd build
        iii.	emcmake cmake ..
        iv.	emmake make
  我们创建了一个build文件夹用来存放cmake相关的生成文件及信息,接着进入build文件夹并使用emcmake及emmake命令生成对应的WebAssembly代码.html、.js、.wasm三个文件。
    f) 编译后产生的目录结构如下图:
 
五、编译期间出现的问题
    a) 编译前需要对wasm/scripts/下的每一个.sh文件运行sed -i 's/\r$//' xxx.sh这个指令,以去除在windows系统中编辑的shell脚本的影响。同时安装pkg-config,即sudo apt install pkg-config。
    b) 构建Flann时出现Could NOT find HDF5这个错误,该错误可以参考https://blog.youkuaiyun.com/MJ_Lee/article/details/122608061解决。

首先,确保你的项目已经正确地链接了 Emscripten SDK。接下来,在 CMakeLists.txt 中添加以下内容: ```cmake cmake_minimum_required(VERSION 3.0) project(your_project) # 设置编译选项 set(CMAKE_CXX_STANDARD 11) set(CMAKE_CXX_STANDARD_REQUIRED ON) set(CMAKE_CXX_EXTENSIONS OFF) # 添加 Emscripten 编译器 SET(CMAKE_C_COMPILER "emcc") SET(CMAKE_CXX_COMPILER "em++") # 添加 Emscripten 编译选项 SET(CMAKE_CXX_FLAGS "${CMAKE_CXX_FLAGS} -s WASM=1 -s USE_SDL=2 -s USE_WEBGL2=1 -s FULL_ES3=1 -s USE_GLFW=3") # 添加源代码 add_executable(your_project main.cpp) # 导出 C 函数为 JavaScript 模块 set_target_properties(your_project PROPERTIES LINK_FLAGS "-s EXPORTED_FUNCTIONS='[\"_your_c_function\"]' -s EXTRA_EXPORTED_RUNTIME_METHODS='[\"ccall\", \"cwrap\"]'") # 指定输出文件名 set_target_properties(your_project PROPERTIES OUTPUT_NAME "your_project") # 指定输出文件类型为 JavaScript 模块 set_target_properties(your_project PROPERTIES SUFFIX ".js") # 拷贝输出文件到指定目录 add_custom_command(TARGET your_project POST_BUILD COMMAND ${CMAKE_COMMAND} -E copy $<TARGET_FILE:your_project> ${CMAKE_CURRENT_SOURCE_DIR}/output/) ``` 以上代码做了以下几件事: 1. 设置编译选项,包括编译标准、编译器等等。 2. 添加 Emscripten 编译器和编译选项。 3. 添加源代码。 4. 导出 C 函数为 JavaScript 模块,这里的 `_your_c_function` 是你需要导出的函数名。 5. 指定输出文件名为 `your_project.js`。 6. 拷贝输出文件到指定目录。 最后,你可以通过以下命令来生成 WebAssembly 项目: ```bash mkdir build && cd build cmake .. make ``` 如果一切顺利,你将得到 `your_project.js` 和 `your_project.wasm` 两个文件,其中前者是 JavaScript 模块,后者是 WebAssembly 模块。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值