cesium两种方式鼠标移入移出实体显示提示框

本文主要是介绍cesium两种方式鼠标移入移出实体显示提示框，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

cesium两种方式鼠标移入移出实体显示提示框

第一种方式

采用cesium的label作为提示框

var labelEntity = viewer.entities.add({label : {show : false,showBackground : true,font : '14px monospace',horizontalOrigin : Cesium.HorizontalOrigin.LEFT,verticalOrigin : Cesium.VerticalOrigin.TOP,pixelOffset : new Cesium.Cartesian2(15, 0)}
});// 鼠标移入labelEntity提示框
handler.setInputAction(function(movement) {var foundPosition = false;if (scene.mode !== Cesium.SceneMode.MORPHING) {var pickedObject = scene.pick(movement.endPosition);if (scene.pickPositionSupported && Cesium.defined(pickedObject) && pickedObject.id !== '') {var cartesian = viewer.scene.pickPosition(movement.endPosition);if (Cesium.defined(cartesian)) {var cartographic = Cesium.Cartographic.fromCartesian(cartesian);labelEntity.position = cartesian;labelEntity.label.show = true;labelEntity.label.text ='地区: ' + pickedObject.id._name;labelEntity.label.eyeOffset = new Cesium.Cartesian3(0.0, 0.0, -cartographic.height * (scene.mode === Cesium.SceneMode.SCENE2D ? 1.5 : 1.0));foundPosition = true;}}}if (!foundPosition) {labelEntity.label.show = false;}
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);

在这里插入图片描述

第二种方式

采用自定义提示框

// 鼠标移入自定义弹出框
handler.setInputAction(function(movement) {if (scene.mode !== Cesium.SceneMode.MORPHING) {var pickedObject = scene.pick(movement.endPosition);if (scene.pickPositionSupported && Cesium.defined(pickedObject) && pickedObject.id !== '') {TooltipDiv.showAt(movement.endPosition, "地区：" + pickedObject.id._name );} else {TooltipDiv.setVisible(false);}}
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);

在这里插入图片描述