Question

请问怎么在三维GIS添加如二维GIS中的marker一样的点?并自定义弹框

Answer 1

你好，可以参考entity中的billboard接口来添加，弹框的话可以通过通过监听entity的选中事件selectedEntityChanged来获取选中的entity，并设置弹框即可

Comments

谢谢您了   能有demo的链接吗?

---

不用了  已经找到了  非常感谢

---

<div id="bubble" class="bubble" style="bottom:0;left:82%;display:none;" >
    
    <div style="height:50px" id="title"></div>
</div>
       
<script type="text/javascript">
    function onload(Cesium) {
    	//气泡相关
        var infoboxContainer = document.getElementById("bubble");
        var viewer = new Cesium.Viewer('cesiumContainer');
       
        //console.log(viewer);
        var scene = viewer.scene;
        var canvas = scene.canvas;
        var widget = viewer.cesiumWidget;
        var scenePosition = null; // 记录在场景中点击的笛卡尔坐标点
        var dock = false; // 是否停靠
         var handlerPoint_ellipse = new Cesium.DrawHandler(viewer,Cesium.DrawMode.Point);
        	handlerPoint_ellipse.activate()
          handlerPoint_ellipse.drawEvt.addEventListener(function(evt){
          	 var point = evt.object;
            var position = point.position;
          	handlerPoint_ellipse.clear();
          	var boxEntity = viewer.entities.add({
                position : position,
                box : {//换成billboard
                    dimensions : new Cesium.Cartesian3(20.0, 20.0, 20.0),
                    //material : color,
                    fill : true,
                    outline : false,
                    outlineColor : Cesium.Color.BLACK,
                    outlineWidth : 4
                },
                id:'yy'
                
            });
          	
         
          	console.log(evt);
          	
          })
        //初始化viewer部件
        scene.postRender.addEventListener(function(){ // 每一帧都去计算气泡的正确位置
            if (scenePosition && !dock) {
                var canvasHeight = scene.canvas.height;
                var windowPosition = new Cesium.Cartesian2();
                Cesium.SceneTransforms.wgs84ToWindowCoordinates(scene, scenePosition, windowPosition);
                infoboxContainer.style.bottom = (canvasHeight - windowPosition.y + 45) + 'px';
                infoboxContainer.style.left = (windowPosition.x - 70) + 'px';
                infoboxContainer.style.visibility = "visible";
            }
        });
        $('#loadingbar').remove();
        try {
            //添加S3M图层服务
            var promise = scene.open('http://localhost:8090/iserver/services/3D-CBD/rest/realspace');
            Cesium.when(promise, function (layers) {
                if(!scene.pickPositionSupported){
                    alert('不支持深度拾取,属性查询功能无法使用！');
                }
                var text=document.getElementById('title')
              //  var layer = scene.layers.find('Building@CBD');
                
                //设置相机视角
         
            screenSpaceEventHandler.setInputAction(function(e) {
            	viewer._.addEventListener(function(entity){
            	console.log(entity);
            	var position = scene.pickPosition(e.position);
            	 scenePosition = position;
            	 text.innerText='我的ID是'+entity._id;
            	 $('#bubble').show();
            })
//             	
//                 
// 
     },Cesium.ScreenSpaceEventType.LEFT_CLICK)

---

再请教一个问题 为什么我在超图官网示例上面编辑添加点是没有问题 ; 同样的代码,复制粘贴过来 点就出不来  也没有报错

---

你好，billboard中image路径，你确认是否是对的

---

确认是对的 检查过很多遍了

---

控制台保错没有

---

这两个错误是一直都有的  我用了IServer 的marker来添加点   是可以的

---

你好，首先，如果你是通过鼠标去点击得到点的话，你必须要有一个点击事件来获取点的坐标，并且保证点的坐标是正确的，写入position

---

不是通过鼠标去点击的  是地图加载后直接加上去的  点位坐标都是正确的  如在超图官网里面能出来  但是到了本地就出不来了  所有都一样  只修改了图片的地址  图片地址也检查很多遍  是没有问题的

---

你下载一个向日葵远程，我看一下

---

识别码:967 676 624  验证码:1717

---

换了版本后报这个

---

你今天有时间吗？我远程看一下

---

可以的  远程账号密码还是一样的