cesium-study
/
36.修改模型的环境光、反射光、自发光.html

<!DOCTYPE html>
<html lang="en">

<head>
    <!-- Use correct character set. -->
    <meta charset="utf-8" />
    <!-- Tell IE to use the latest, best version. -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <!-- Make the application on mobile take up the full browser screen and disable user scaling. -->
    <meta name="viewport"
        content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
    <title>Hello World!</title>
    <script src="Build/Cesium/Cesium.js"></script>
    <script src="js/jquery.min.js"></script>
    <style>
        @import url(Build/Cesium/Widgets/widgets.css);

        html,
        body,
        #cesiumContainer {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
            overflow: hidden;
        }
    </style>
</head>

<body>
    <div id="cesiumContainer"></div>
    <script>

        //创建一个基本地球
        let viewer = new Cesium.Viewer("cesiumContainer", {
            imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
                url: 'http://t0.tianditu.gov.cn/img\_w/wmts?tk=0702d09e30dca11ed07ba4cec6d6bdac',
                layer: 'img',
                style: 'default',
                tileMatrixSetID: 'w',
                format: 'tiles',
                maximumLevel: 18
            }),
            animation: false, //动画控制，默认true （图中1）
            baseLayerPicker: false,//地图切换控件(底图以及地形图)是否显示,默认显示true  （图中6）
            fullscreenButton: true,//全屏按钮,默认显示true  （图中4）
            geocoder: false,//地名查找,默认true  （图中9）
            timeline: false,//时间线,默认true  （图中3）
            vrButton: false,//双屏模式,默认不显示false
            homeButton: true,//主页按钮，默认true  （图中8）
            infoBox: false,//点击要素之后显示的信息,默认true
            selectionIndicator: true//选中元素显示,默认true
        });
        viewer.cesiumWidget.creditContainer.style.display = "none";//去cesium logo水印
        viewer.scene.debugShowFramesPerSecond = true;//开启帧数
        viewer.shadows = true;


        //添加文字
        viewer.entities.add({
            name: '文字',
            position: Cesium.Cartesian3.fromDegrees(116.3904715, 39.90571),
            label: {
                text: '看这里',
                font: '19px Helvetica',
                style: Cesium.LabelStyle.FILL_AND_OUTLINE,
                fillColor: Cesium.Color.AZURE,
                outlineColor: Cesium.Color.BLACK,
                outlineWidth: 3,
                verticalOrigin: Cesium.VerticalOrigin.BOTTOM, //垂直方向以底部来计算标签的位置
            }
        });


        let scene = viewer.scene;
        //位置，经纬度+高度
        {
            let position = Cesium.Cartesian3.fromDegrees(116.3904715, 39.90571, 0);
            let hpRoll = new Cesium.HeadingPitchRoll();//这个里面可以修改自身的角度，可以传入h、p、r值
            let fixedFrameTransforms = Cesium.Transforms.localFrameToFixedFrameGenerator('north', 'west');
            //添加模型
            let carPrimitive = scene.primitives.add(Cesium.Model.fromGltf({
                url: '测试辅助文件/glTF/测试场景含BPR/1.gltf',
                //modelMatrix: Cesium.Transforms.headingPitchRollToFixedFrame(position, hpRoll, Cesium.Ellipsoid.WGS84, fixedFrameTransforms),//这个会转向
                modelMatrix: Cesium.Transforms.headingPitchRollToFixedFrame(position, hpRoll),
                minimumPixelSize: 500,
                scale: 1.0
            }));
            carPrimitive.imageBasedLightingFactor = new Cesium.Cartesian2(1, 1);//关键的地方

            //    carPrimitive.imageBasedLightingFactor = new Cesium.Cartesian2(10.0, 10.0);
        }
        {
            let position = Cesium.Cartesian3.fromDegrees(116.3904705, 39.91570, 0);
            let hpRoll = new Cesium.HeadingPitchRoll();//这个里面可以修改自身的角度，可以传入h、p、r值
            let fixedFrameTransforms = Cesium.Transforms.localFrameToFixedFrameGenerator('north', 'west');
            //添加模型
            let carPrimitive = scene.primitives.add(Cesium.Model.fromGltf({
                url: '测试辅助文件/glTF/测试场景含BPR/1.gltf',
                //modelMatrix: Cesium.Transforms.headingPitchRollToFixedFrame(position, hpRoll, Cesium.Ellipsoid.WGS84, fixedFrameTransforms),//这个会转向
                modelMatrix: Cesium.Transforms.headingPitchRollToFixedFrame(position, hpRoll),
                minimumPixelSize: 500,
                scale: 1.0
            }));
            carPrimitive.imageBasedLightingFactor = new Cesium.Cartesian2(0, 5);

            //    carPrimitive.imageBasedLightingFactor = new Cesium.Cartesian2(0.0, 0.0);


        }

        var utc = Cesium.JulianDate.fromDate(new Date("2019/10/04 10:30:00"));//UTC
        viewer.clockViewModel.currentTime = Cesium.JulianDate.addHours(utc, 8, new Cesium.JulianDate());//北京时间=UTC+8=GMT+8

        alert("修改模型的环境光、反射光、自发光");
    </script>
</body>

</html>