Mars3D开发基础学习:Material材质
在真实世界里,每个物体会对光产生不同的反应。钢看起来比陶瓷花瓶更闪闪发光,一个木头箱子不会像钢箱子一样对光产生很强的反射。每个物体对镜面高光也有不同的反应。有些物体不会散射(Scatter)很多光却会反射(Reflect)很多光,结果看起来就有一个较小的高光点(Highlight),有些物体散射了很多,它们就会产生一个半径更大的高光。如果我们想要在Mars3D(即WebGL)中模拟多种类型的物体,我们必须为每个物体分别定义材质(Material)属性。
#1.平台内材质的底层:Fabric
Fabric 是平台中基于JSON格式来描述Material的机制。材质描述多边形、折线、椭球等对象的外观特征。材质可以简单的是覆盖一张图片,或者是条纹或者棋盘图案。使用Fabric 和GLSL,可以从零开始写脚本新建材质,也可以从现有的材质中派生。比如潮湿碎裂的砖块可以使用程序生成的纹理、凹凸贴图和反射贴图来组合。对象通过material 属性来支持材质效果。
Cesium官方介绍资料:Fabric介绍资料
#2.平台内材质清单
材质类均在mars3d.material.*
命名空间下面。材质类型清单请访问MaterialType
#2.1 默认材质
如果在构造矢量数据的style参数中,没有指定material
或materialType
参数时:
- (1) 如有传入
color
参数后,默认内部转换为Color材质 - (2) 如有传入
image
参数后,默认内部转换为Image材质
#2.2 使用MaterialUtil工厂方法构造材质
对材质的创建平台提供了MaterialUtil 静态工厂方法来快捷创建材质对象,并传入style中material
参数赋值给矢量对象。可以参考下面示例代码。在js代码中建议此种方式,代码更易读些。
//Entity矢量对象
let graphic = new mars3d.graphic.PolylineEntity({positions: [[117.169646, 31.769171],[117.194579, 31.806466],],style: {width: 5,material: mars3d.MaterialUtil.createMaterialProperty(mars3d.MaterialType.LineFlow, {color: '#00ff00',image: 'img/textures/LinkPulse.jpg',speed: 5,}),},
})
graphicLayer.addGraphic(graphic)//Primitive矢量对象
var primitive = new mars3d.graphic.PolylinePrimitive({positions: [[117.348938, 31.805369, 7.63],[117.429496, 31.786715, 8.41],],style: {width: 5,material: mars3d.MaterialUtil.createMaterial(mars3d.MaterialType.LineFlow, {color: '#1a9850',image: 'img/textures/ArrowOpacity.jpg',speed: 10,}),},
})
graphicLayer.addGraphic(primitive)
material
参数 也支持使用直接new构造对应的材质类、或用 Cesium原生支持的各类材质对象。
#2.3 使用materialType参数构造材质
平台内部也提供了一种更简便的方式,直接在style中传入 materialType
参数 和 其对应类型所需的材质参数 ,直接使用,比如当前平台的geojson保存及读取、symbol参数配置等功能中就是采用此种方式。 在json配置和有保存及读取的场景中建议使用此种方式,使用更简单。 可以参考下面示例代码。
//Entity矢量对象
let graphic = new mars3d.graphic.PolylineEntity({positions: [[117.169646, 31.769171],[117.194579, 31.806466],],style: {width: 5,materialType:mars3d.MaterialType.LineFlow,color: '#00ff00',image: 'img/textures/LinkPulse.jpg',speed: 5, },
})
graphicLayer.addGraphic(graphic)//Primitive矢量对象
var primitive = new mars3d.graphic.PolylinePrimitive({positions: [[117.348938, 31.805369, 7.63],[117.429496, 31.786715, 8.41],],style: {width: 5,materialType:mars3d.MaterialType.LineFlow, color: '#1a9850',image: 'img/textures/ArrowOpacity.jpg',speed: 10, },
})
graphicLayer.addGraphic(primitive)
#2.4. 运行效果
Mars3D开发基础学习:Material材质相关推荐
- Mars3D开发基础学习:glTF小模型
glTF全称是 Graphics Language Transmission Format (图形语言传输格式),是一种针对GL(WebGL,OpenGL ES以及OpenGL)接口的运行时资产传递格 ...
- Mars3D开发基础学习:Property属性机制
平台是数据驱动和 time-dynamic visualization,这些可都是仰仗Property属性机制来实现的. Property最大的特点是和时间相互关联,在不同的时间可以动态地返回不同的属 ...
- Mars3D开发基础学习:矢量数据
矢量数据 是用经度.纬度.高度坐标来表示地图图形或地理实体位置的数据,一般是通过记录坐标的方式来尽可能将地理实体的空间位置表现的准确无误,常见的矢量数据有:点.线.面.体等格式. #1. 矢量数据对象 ...
- Mars3D开发基础学习:坐标系及坐标变换
只要涉及到地图开发,无论如何关于坐标系的概念是逃不掉的,谁让地球它是个球呢. 地球就像个橘子 不同的坐标系就是不同的剝橘子的方法 这里就不列举国内常用的坐标系及转换方法,大家可以自行百度. 相关GIS ...
- Mars3D开发基础学习:场景特效
平台支持一些场景特效,包括 雾天气,雨天气,雪天气, 泛光特效,亮度效果,夜视效果,黑白效果,马赛克效果,景深效果 等. #1. 特效的底层实现:后处理(Post Processing) 特效底层是使 ...
- Mars3D开发基础学习:矢量图层
三维场景中,地形和栅格来组成了三维的基础,但更多的业务还是需要 点线面等矢量数据来充实, 这就是我们的矢量数据图层. #1. 图层类型清单 当前主要使用的矢量图层,是指GraphicLayer 类及其 ...
- Mars3D开发基础学习:栅格瓦片图层
前面我们说到地形是三维场景的"骨骼",栅格瓦片图层就是我们浏览三维能感知的"皮肤"了,通常我们叠加的是各种卫星影像或瓦片数据. Mars3D支持多种服务来源的高 ...
- Mars3D开发基础学习:相机Camera及视角控制
Camera相机控制了三维场景的视图.有很多方法可以操作Camera,如旋转(rotate).缩放(zoom).平移(pan)和飞到目的地(flyTo).同时也有鼠标和触摸事件用来处理与Camrea的 ...
- 虚幻引擎虚拟现实开发基础学习教程
流派:电子学习| MP4 |视频:h264,1280×720 |音频:AAC,44.1 KHz 语言:英语+中英文字幕(根据原英文字幕机译更准确)|大小解压后:3.93 GB |时长:5h 15m 了 ...
最新文章
- codeforces 293E Close Vertices 点分治+滑窗+treap
- BZOJ.4888.[TJOI2017]异或和(树状数组)
- 04_Flink-HA高可用、Standalone集群模式、Flink-Standalone集群重要参数详解、集群节点重启及扩容、启动组件、Flink on Yarn、启动命令等
- 目标检测的图像特征提取—Haar特征
- SSH框架配置及Maven使用
- 数据结构——基于 Dijsktra 算法的最短路径求解
- python处理实例_python处理xml实例
- java中的构造方法与代码块
- 做任务云闪付为什么要实名认证_ISO9001质量体系认证:为什么要做?如何去做?...
- JS判断手机端是否安装某应用
- java 加锁_Java中的重重“锁”事
- 《Maven_孔浩》Maven介绍及安装
- window.dialogArguments
- 有道词典“网络已断开”的解决办法
- 【v1.4.4】H5匿名信一封来信更新公告,新版升级教程
- 公众号 接收规则 消息_微信公众号教程(11)公众账号接收非文字消息 上
- 关于微信公众号文章抓取
- 利用Python使基金定投收益最大
- 发几个springBoot常用的banner文字图案
- 服务器系统盘清理工具,Windows添加磁盘清理工具的方法
热门文章
- 农产品价格数据可视化展示分析(附各省js文件)
- 学生计算机2的4次方,学生专用计算器怎么开N次方
- android 6.0 连接电脑,如何通过蓝牙连接您的Android 6.0棉花糖设备到您的电脑 | MOS86...
- [书摘]游戏开发核心技术-剧本和角色创造
- 顶会论文 | 阿里云视频摘要SOTA模型:用于视频摘要的多层时空网络
- 如何手动下载timm的pretrained模型
- win7造字(不全好用)
- 红鸟沙龙(12)|李泽湘:端到端创业教育与实践探索
- DSP RTB SSP
- thinkphp 6.x 数据库增删改查