zfxcms ^回到顶部

您的当前位置:首页 > web资讯 > WEB框架 >cesium > Cesium--模型加载

Cesium--模型加载

所属分类: cesium   2019-04-02 14:20:35  编辑:admin  浏览次数 811 次

cesium加载gltf格式的三维模型流程。主要分为两个过程:

1gltf转换工具
2cesium加载
1gltf转换工具
现今常用的三维建模工具(3d max、maya、creator、sketch up等等)都不支持gltf格式文件的直接导出,因此需要通过中间格式的转换。github上也提供了开源的转换工具:objTo3d-tiles。通过obj中间格式转换的。
经测试,该工具可以正常使用。在网上下载一个obj格式的模型:barrel.obj
Cesium学习笔记11--模型加载

使用命令:
Cesium学习笔记11--模型加载
转换后:
Cesium学习笔记11--模型加载

2cesium加载
将转后文件拷贝到工程中,使用cesium的entity加载model接口:
Cesium学习笔记11--模型加载
最终加载结果如下:
Cesium学习笔记11--模型加载

整个代码:
 var esri = new Cesium.ArcGisMapServerImageryProvider({
        url: 'https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer',
        enablePickFeatures: false
    });
   
    var viewer = new Cesium.Viewer('cesiumContainer', {
        imageryProvider: esri,
        contextOptions: {
            webgl: {
                alpha: true
            }
        },
        creditContainer: "creditContainer",
        selectionIndicator: false,
        animation: false,  //是否显示动画控件
        baseLayerPicker: false, //是否显示图层选择控件
        geocoder: false, //是否显示地名查找控件
        timeline: false, //是否显示时间线控件
        sceneModePicker: true, //是否显示投影方式控件
        navigationHelpButton: false, //是否显示帮助信息控件
        infoBox: false,  //是否显示点击要素之后显示的信息
        fullscreenButton: true
    });
    //取消双击事件   viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
    createModel('./sampledata/model/barrel.gltf', 0.0);
    function createModel(url, height) {
        viewer.entities.removeAll();
        var position = Cesium.Cartesian3.fromDegrees(-123.0744619, 44.0503706, height);
        var heading = Cesium.Math.toRadians(135);
        var pitch = 0;
        var roll = 0;
        var hpr = new Cesium.HeadingPitchRoll(heading, pitch, roll);
        var orientation = Cesium.Transforms.headingPitchRollQuaternion(position, hpr);
        var entity = viewer.entities.add({
            name: url,
            position: position,
            orientation: orientation,
            model: {
                uri: url,
                minimumPixelSize: 128,
                maximumScale: 20000
            }
        });
        viewer.trackedEntity = entity;
    }


Web文章检索

Web文章目录