Cesium场景内Enitity点击事件的监听

Cesium场景内Enitity点击事件的监听

**

Cesium如何监听Enitity的点击事件,在前几篇博客我们已经讲到了如何获取鼠标的点击事件，以及场景的点击获取经纬度，其实Cesium自带的还有个可以获取当前点击的物体的事件，废话少说，上代码：

		var viewer = new Cesium.Viewer('cesiumContainer', {
			//加载天地图影像地图，WebMapTileServiceImageryProvider该接口是加载WMTS服务的接口
			imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
			animation: false, //是否显示动画控件
			shouldAnimate: true,
			homeButton: false, //是否显示Home按钮
			fullscreenButton: false, //是否显示全屏按钮
			baseLayerPicker: false, //是否显示图层选择控件
			geocoder: false, //是否显示地名查找控件
			timeline: false, //是否显示时间线控件
			sceneModePicker: true, //是否显示投影方式控件
			navigationHelpButton: false, //是否显示帮助信息控件
			infoBox: false, //是否显示点击要素之后显示的信息
			requestRenderMode: true, //启用请求渲染模式
			scene3DOnly: false, //每个几何实例将只能以3D渲染以节省GPU内存
			sceneMode: 3, //初始场景模式 1 2D模式 2 2D循环模式 3 3D模式  Cesium.SceneMode
			//加载谷歌影像地图，UrlTemplateImageryProvider该接口是加载谷歌地图服务的接口
				url: 'http://t0.tianditu.gov.cn/img_w/wmts?tk=ebf64362215c081f8317203220f133eb',
				layer: 'img',
				style: 'default',
				tileMatrixSetID: 'w',
				format: 'tiles',
				maximumLevel: 18
			})
		});
		    //定义监控的点位，也可以为后台传输过来的
    var cameraArras = [{
	            name: "监控1",
	            x: 113.180830883244,
	            y: 27.756677157393,
	            z: 10
	        },
	        {
	            name: "监控2",
	            x: 113.180832598893,
	            y: 27.7578087835959,
	            z: 10
	        },
    ]    
    //循环添加所有的监控点位
    for (i = 0; i < cameraArras.length; i++) {
        viewer.entities.add({
            id: cameraArras[i].name,
            position: Cesium.Cartesian3.fromDegrees(cameraArras[i].x, cameraArras[i].y, cameraArras[i].z),
            billboard: {
            	//这里需要改成您本地的路径的图片信息。
                image: "../../img/point.png",
                width: 30,
                height: 60,
            },
            label:{
					//文字内容
					text :  cameraArras[i].name,
					//文字填充颜色
					fillColor : Cesium.Color.WHITE,
					//文本大小与字体
					font:'normal 20px Microsoft YaHei UI',
					//是否显示背景
					showBackground : false,
					//背景墙的颜色
					backgroundColor:Cesium.Color.fromCssColorString("rgba(52,79,209,1.0)"),
					//背景宽度
					backgroundPadding : new Cesium.Cartesian2(3, 3),
					//文字与背景墙的总大小
					scale : 0.9,
					//文本轮廓
					style: Cesium.LabelStyle.FILL_AND_OUTLINE,
					//外边界颜色
					outlineColor : Cesium.Color.BLACK,
					//外边界宽度
					outlineWidth : 2,
					//文本出现的位置
					verticalOrigin : Cesium.VerticalOrigin.BOTTOM,
					//文本的偏移方向
					pixelOffset : new Cesium.Cartesian2(0, -20)
			}
        });
    }
         //注册场景点击事件
    var handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
            handler.setInputAction(function (e) {
                      var pick = viewer.scene.pick(e.position);
                                if (pick&&pick.id) {
                                	//点击物体的属性都存在pick.id内部
                                    alert("点击到了："+pick.id._id);
                                }
             }, Cesium.ScreenSpaceEventType.LEFT_CLICK);

后续小编会持续更新cesium各种源码，特效以及其他效果或者模型加载的实现方式，还希望大家多多关注，小编也会持续更新的！

声明：转载请声明出处。