实时视频投放的原理是将rtsp的视频流利用websocket推送给前端，video元素来播放视频。在三维场景中设置视频投放观察者的位置(监控设备的位置)和相关参数，形成一个固定方向和范围的视锥体，该视椎体与三维模型缓存相交的部分，即为投放视频或者图片的区域。

WebGL中对应的接口：ProjectionImage,相关的参数说明如下：

- direction : Number,获取或设置视频投放时投影仪的方位角，即顺时针与正北方向的夹角，取值范围：0度~36度。

- distance : Number,获取或设置观察点到投影仪的距离。

- hintLineColor : Color,获取或设置视频投放时提示线的颜色。

- hintLineVisible : Color,获取或设置视频投放时提示线的可见性。

- horizontalFov : Number,获取或设置视频投放时投影仪的水平视角范围，单位：度。

- pitch : Number,获取或设置视频投放时投影仪的俯仰角，该角指相机方向和水面方向的夹角，取向上为正，单位：度。

- verticalFov : Number,获取或设置视频投放时投影仪的垂直视角范围，单位：度。

- viewPosition : Array,获取或设置视频投放观察者的位置。位置由经度、纬度和高程组成的数组表示。

. 在调整好的视频中，发现深灰色的区域与实际场景中的道路不平行。这可能是因为测试视频与实际场景不匹配，只需理解处理流程即可。

2. 选中右侧工具栏中的同名点配准功能，点击按钮后将出现一个操作页面。左侧为待处理的投放视频，右侧为对应的三维场景。

3. 点击左上方的按钮，在视频上标记一些特征点，例如：

4. 用相同的方法，在右侧的三维场景中标记一些对应的配准点。

5. 点击确定，三维场景中的视频将完成配准。具体效果如下图所示(请注意，这里的标记点可能不够精确，但只要理解原理即可)。

6. 最后将视频投放的结果输出，并将其保存为三维点数据集，供WebGL端加载和显示。