SuperMap iClient3D for WebGL教程(Entity)-PointGraphics

作者:为梦齐舞

本文同步更新于简书文章[https://www.jianshu.com/p/20a402abec6d]

本节继续学习PointGraphics对象,这个是一个点类型,对象属性相对较少,可以直接添加矢量点对象,接下来我们一起学习下吧。
点

实现代码如下:

viewer.entities.add({
					id: "test",
					position:Cesium.Cartesian3.fromDegrees(117,32,500),
					point: {		
						color: Cesium.Color.RED,
						pixelSize:20,
						outlineColor:Cesium.Color.BLUE,
						outlineWidth:5,
						disableDepthTestDistance:Number.POSITIVE_INFINITY
					}

				});

一、主要参数介绍

1、position:点的坐标位置,需要注意的是这个属性是设置给entity的,而不是point的内部。
2、pixelSize:点的大小,以像素为单位。
3、outlineColor:点的外边框颜色。
4、outlineWidth:点外边框的宽度。
5、show:点是否显示。
6、scaleByDistance:设置基于相机距离的点大小,也就是说可以根据不同的相机高度来设置点的不同大小,一个NearFarScalar类型,比如我设置scaleByDistance为new Cesium.NearFarScalar(1500, 10, 50000, 2),如果设置了pixelSize则两者会相乘。
7、translucencyByDistance:设置基于相机距离的点透明度,也就是说可以根据不同的相机高度来设置点的透明度,一个NearFarScalar类型,比如我设置scaleByDistance为new Cesium.NearFarScalar(1500, 0.1, 8000, 1)
8、heightReference:高度模式,支持Cesium.HeightReference.NONE(绝对高度)、Cesium.HeightReference.RELATIVE_TO_GROUND(相对地面)、Cesium.HeightReference.CLAMP_TO_GROUND(贴地)三种高度模式,高度模式通过字面意思理解即可。
9、distanceDisplayCondition:即是控制点在什么相机位置下显示出来。例如设置distanceDisplayCondition:new Cesium.DistanceDisplayCondition(1500,5000),即是在相机距离1500-5000的位置显示,其他具体广告牌都不显示。
10、disableDepthTestDistance:指定从相机到禁用深度测试的距离,如果不希望被地形挡住,设置为Number.POSITIVE_INFINITY即可
##二、综合使用
我们制作一个闪烁的有呼吸效果的点对象,效果如下:
在这里插入图片描述

实现代码如下:

var x = 0;
				var size = 10;
				var isAdd = true;
				var isZoom = true;
				viewer.entities.add({
					id: "test",
					position: Cesium.Cartesian3.fromDegrees(117, 32, 500),
					point: {
						color: new Cesium.CallbackProperty(function() {
							if(isAdd) {
								x = x + 0.05;
								if(x > 1) {
									isAdd = false;
								}
							} else {
								x = x - 0.05;
								if(x < 0) {
									isAdd = true;
								}
							}
							return Cesium.Color.RED.withAlpha(x);
						}, false),
						pixelSize: new Cesium.CallbackProperty(function() {
							if(isZoom) {
								size = size + 1;
								if(size > 50) {
									isZoom = false;
								}
							} else {
								size = size - 1;
								if(size < 10) {
									isZoom = true;
								}
							}
							return size;
						}, false),
						outlineColor: new Cesium.CallbackProperty(function() {
							if(isAdd) {
								x = x + 0.01;
								if(x > 1) {
									isAdd = false;
								}
							} else {
								x = x - 0.01;
								if(x < 0) {
									isAdd = true;
								}
							}
							return Cesium.Color.BLUE.withAlpha(x);
						}, false),
						outlineWidth: 5,
						disableDepthTestDistance: Number.POSITIVE_INFINITY,
					}

				});
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值