cesium--添加模型

前言

模型有很多种,一般我们用3dMax自己做了模型,在cesium中添加需要转换成glb的格式,而且沙盒例子中也是如此举例.我们看看模型的选项及属性.

api翻译

ModelGraphics

基于gltf的三维模型，WebGL、OpenGL ES和OpenGL的运行时资产格式。模型的位置和方向由包含实体确定。cesium包括对GLTF几何、材质、动画和蒙皮的支持。目前不支持摄像头和灯。

名称	作用
uri	模型的路径地址
show	是否显示模型
scale	缩放比例
minimumPixelSize	指定模型的近似最小像素大小（不考虑缩放）的数值属性
maximumScale	模型的最大比例大小。最小像素化的上限
incrementallyLoadTextures	确定加载模型后纹理是否可以继续流入
runAnimations	指定是否应启动模型中指定的GLTF动画
clampAnimations	指定GLTF动画是否应在没有关键帧的情况下保持最后一个姿势
nodeTransformations	一个对象，其中键是节点的名称，值是translationrotationscale属性，描述要应用于该节点的转换。转换将在GLTF中指定的节点的现有转换之后应用，并且不会替换节点的现有转换
shadows	阴影
heightReference	相对高度
distanceDisplayCondition	指定此模型将显示在与相机的距离
silhouetteColor	轮廓颜色的属性
silhouetteSize	轮廓大小的属性
color	模型颜色
colorBlendMode	颜色与模型的混合方式,比如高亮,常用的有HIGHLIGHT,MIX,REPALCE
colorBlendAmount	混合的程度,必须在colorBlendMode为MIX时才有效
clippingPlanes	选择性地禁用呈现模型
imageBasedLightingFactor	指定基于漫反射和镜面反射图像的照明的贡献的属性
lightColor	指定在为模型着色时使用的灯光颜色的属性。未定义时将使用默认的日光颜色

代码

var position = Cesium.Cartesian3.fromDegrees(113.03, 23.42, 2);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: "plane",position: position,//orientation: orientation,model: {uri: "./modle/air/Cesium_Air.glb",minimumPixelSize: 128,//最小的模型像素maximumScale: 20000,//最大的模型像素runAnimations:true,//是否显示动画clampAnimations:true,//是否保持最后一针的动画//color:Cesium.Color.RED,//颜色color:Cesium.Color.fromAlpha(Cesium.Color.RED, parseFloat(1.0)),//包含透明度的颜色colorBlendMode:Cesium.ColorBlendMode['MIX'],//常用的有三个HIGHLIGHT,REPLACE,MIXcolorBlendAmount:0.1//这个属性必须是MIX混合属性才能生效,见colorBlendMode}});//设置摄像头定位到模型处viewer.trackedEntity = entity;

效果预览

cesium--添加模型相关推荐

Cesium添加模型实时更新偏航角
开发工具与关键技术: 作者:熊琪撰写时间:2020年9月8日首先简单的说下cesium是什么,cesium是一个跨平台.跨浏览器的展示三位地球和地图的js库,cesium使用WebGL来进行硬件加 ...
vue2 使用 cesium 【第二篇-相机视角移动+添加模型】
vue2 使用 cesium [第二篇-相机视角移动+添加模型] 搞了一阵子 cesium,小白入门,这东西很牛逼,但是感觉这东西好费劲啊!网上资料不多,每个人的用法又不一样,操作起来真的是绝绝子.之 ...
cesium 添加纽约城市模型
一.cesium 添加纽约3D建筑效果代码 Cesium.Ion.defaultAccessToken='eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGki ...
基于 React hooks + Typescript + Cesium 实现模型剖切分析
文章目录效果截图功能介绍实现思路实现步骤根据数据获取裁剪面 modelMatrix 创建 clippingPlanes 添加鼠标事件封装 Clipping3D 类使用 Clipping3 ...
Cesium获取模型(Primitive)的位置与方向
1.获取位置(primitive) //modelMatrix为Primitive添加模型时的modelMatrix Cesium.Matrix4.getTranslation( modelMatri ...
Cesium设置模型朝向速度矢量方向
Cesium设置模型朝向速度矢量方向文章目录 Cesium设置模型朝向速度矢量方向 1. 需求场景 2. 技术路线 2.1 VelocityOrientationProperty 2.2 Veloc ...
cesium实现模型动态移动效果
文章目录 1.实现效果 2.实现方法 2.1实现思路 2.2具体代码 Cesium实战系列文章总目录: 传送门 1.实现效果 2.实现方法 2.1实现思路 (1)官方沙盒示例参考:传送门官方示例中需 ...
Cesium 添加多个实体并让其运动
Cesium 添加多个实体并让其运动开发工具与关键技术:作者:熊琪撰写时间:2020年9月28日首先要搞明白怎么同时添加多个实体,并让其运动起来,有以下几个步骤: 1.把需要运动的轨迹经过的坐标点 ...
【译】ASP.NET MVC 5 教程 - 4：添加模型
原文:[译]ASP.NET MVC 5 教程 - 4:添加模型在本节中,我们将添加一些管理电影数据库的类,这些类在ASP.NET MVC 应用程序中扮演"Model"的角色. 我 ...
在osgEarth中添加模型的简单示例
一个在osgEarth中加载模型的小示例,方便在此基础上进行其它场景编辑,资源为osgEarth自带Data. #include "common.h" #include <W ...

cesium--添加模型

前言

api翻译

代码

效果预览

cesium--添加模型相关推荐

最新文章

热门文章