mapbox - 将 3D 模型导入 Mapbox

Question

我看到一篇“向 Mapbox GL JS map 添加 3D 模型”的帖子。如果我有从 Autodesk Revit 导出的 GLTF 模型，如何通过给定的地理坐标 (wgs84) 将 3D 模型准确放置在 map 上？

Answer 1

您探索过threebox的最新版本吗？ ??它使您能够通过 CustomLayerInterface 使用 Mapbox 对 3D 对象的支持，在 Mapbox 之上添加任意数量的模型和 3D 图层，只需几行代码

    map.on('style.load', function () {
        map.addLayer({
            id: 'custom_layer',
            type: 'custom',
            renderingMode: '3d',
            onAdd: function (map, mbxContext) {

                window.tb = new Threebox(
                    map,
                    mbxContext,
                    { defaultLights: true }
                );

                var options = {
                    obj: '/3D/soldier/soldier.glb',
                    type: 'gltf',
                    scale: 1,
                    units: 'meters',
                    rotation: { x: 90, y: 0, z: 0 } //default rotation
                }

                tb.loadObj(options, function (model) {
                    soldier = model.setCoords(origin);
                    tb.add(soldier);
                })

            },
            render: function (gl, matrix) {
                tb.update();
            }
        });
    })

你还可以做更多... - 3D 模型内置和自定义动画

- 完全光线转换支持 MouseOver/Mouseout、选定、拖放、拖放、旋转、线框

- 考虑海拔高度的 CSS2D 工具提示和标签

- 三个.js 和 Mapbox 相机与深度调整同步

- 包括具有阳光和阴影内置支持的纪念碑地理定位模型

- 优化加载数千个 3D 对象