@Magnum+WebAssembly——实现网页中显示三维模型（一）
文章简介
最近老师给了个任务，利用Magnum框架以及WebAssembly技术实现在网页中显示三维零件，所以准备写更新一个系列博客，用来记录项目进展。
WebAssembly环境配置
首先，是WebAssembly，其简介可参考中文文档，这里不做过多解释。要想使用WebAssembly，就需要通过Emscripten编译器将C/C++以及其他支持的语言（Emscripten仅支持C/C++）编译成wasm文件。其环境配置分为三步（参考文章）：
- 安装Python 2.7.12或更新版（如2.7.18）；
- 安装Git；
- 安装Emscripten编译器。(Emscripten官网)
安装Python
Python下载地址：（下载完成后安装，安装过程一路默认即可）点我下载
安装完成后，可进行以下操作:
- 配置环境变量（若有多个版本的Python，则需在环境变量中将此版本的安装路径放在最前面）。
- 验证版本。打开cmd并输入python –-version即可。
安装Git
Git下载地址：（下载完成后安装，安装过程一路默认即可）点我下载
- 验证版本。打开cmd并输入Git --version即可。
安装Emscripten 编译器(emcc)
EMCC的 安装分为四步：
- 克隆emsdk仓库；
- 安装；
- 配置环境变量；
- 验证安装是否成功。
克隆emsdk仓库
打开cmd并执行以下命令：
# 建立安装目录，如D:\WebAssemblyTest
mkdir d:\WebAssemblyTest
?
# 切换到目录D:\WebAssemblyTest
cd /d d:\WebAssemblyTest
?
# 克隆emsdk仓库到目录D:\WebAssemblyTest
git clone https://github.com/juj/emsdk.git
?
# 切换到目录D:\WebAssemblyTest下的emsdk文件夹
cd emsdk
?
# 更新emsdk确保是最新版
emsdk.bat update
?
# 这里使用的是git，所以运行时会提示使用"git pull"
git pull
安装
3.1中的命令执行完成后，紧接着执行以下命令：
# 安装各种工具
emsdk.bat install latest
在执行emsdk.bat install latest会下载安装很多东西，时间会有些久，这些工具经常会下载失败。好在第一次执行emsdk.bat install latest 成功下载并安装的东西，在再次执行这条指令的时候并不需要重新下载安装，所以如果发现某一工具下载失败，可以复制命令行中的下载地址，使用其他方式先下载好，并事先将下载好的文件放在emsdk文件夹中的zips文件夹中。如果这个方法仍不能解决问题（很大概率文件放进去了，还是会提示在下载，并会把放进去的文件删除），可以先挂上VPN，然后反复执行emsdk.bat install latest直到下载并安装成功。
# 激活sdk包
emsdk.bat activate latest
配置环境变量
找到emsdk文件夹中的“emcmdprompt“文件并双击打开。可以看到如下内容（以实际情况为准）。
Adding directories to PATH:
PATH += D:\WebAssemblyTest\emsdk\clang\e1.37.36_64bit
PATH += D:\WebAssemblyTest\emsdk\node\8.9.1_64bit\bin
PATH += D:\WebAssemblyTest\emsdk\python\2.7.13.1_64bit\python-2.7.13.amd64
PATH += D:\WebAssemblyTest\emsdk\java\8.152_64bit\bin
PATH += D:\WebAssemblyTest\emsdk\emscripten\1.37.36
?
Setting environment variables:
EMSDK = D:/WebAssemblyTest/emsdk
BINARYEN_ROOT = D:\WebAssemblyTest\emsdk\clang\e1.37.36_64bit\binaryen
JAVA_HOME = D:\WebAssemblyTest\emsdk\java\8.152_64bit
EMSCRIPTEN = D:\WebAssemblyTest\emsdk\emscripten\1.37.36
- 在系统变量中的Path值中添加上诉第一个代码段中的5个变量。
- 新建系统变量EMSDK，值设置为D:/WebAssemblyTest/emsdk。
- 新建系统变量BINARYEN_ROOT，值设置为D:\WebAssemblyTest\emsdk\clang\e1.37.36_64bit\binaryen
- 新建系统变量JAVA_HOME，值设置为D:\WebAssemblyTest\emsdk\java\8.152_64bit
- 新建系统变量EMSCRIPTEN，值设置为D:\WebAssemblyTest\emsdk\emscripten\1.37.36
验证安装是否成功
关闭cmd并重新打开，输入emcc -v若未报错，那么安装成功。
Emcc使用介绍
官方介绍，言简意赅，通俗易懂