提交

ansel0926

2022-05-14 ecdaa37a673565e8e7419ac9062106b89e051c3e

提交

 assets/css/popup.css

@@ -2,7 +2,7 @@
    position: absolute;
    z-index: 999;
    background: transparent;
    opacity: 0.5;
    opacity: 1;
    border-radius: 4px;
    border-style:solid;
    border-color: rgb(0,133,203);

 assets/map/map3D.js

@@ -152,6 +152,9 @@
            if(labelLayer!=null){//关闭文字编辑弹窗
                layer.close(labelLayer);
            }
            $(".medium-item").children().filter(".bx-popup-ctn").each(function () {//隐藏pop
                this.style.display="none"
            })
            if (pick != undefined && pick instanceof Cesium.Cesium3DTileFeature) {
                var propertyNames = pick.getPropertyNames();
                var length = propertyNames.length;
@@ -231,6 +234,16 @@
                        });
                    }
                    else if(entity._name=='drawPointEntity'){
                        //console.log(pickPrimitive._position)
                        // let popup = new Popup({
                        //     viewer:viewer,
                        //     geometry:pickPrimitive._position,
                        //     entity:entity,
                        //     id: "pop_" + entity.id
                        // })
                        // if( drawEntity.imagePath!=null&& drawEntity.imagePath!=""){
                        //     $("#pop_" + entity.id).children(".bx-popup-content-ctn").children(".bx-popup-content").children(".image")[0].src = parent.httpConfig.webApiUrl+drawEntity.imagePath;
                        // }
                        document.getElementById("pop_" +entity.id).style.display="block";
                        layer.config({
                            extend: 'myskin/style.css' //同样需要先加载新皮肤
@@ -831,17 +844,22 @@
    let signPointEntity = viewer.entities.getById(id);
    let popId="pop_"+id;
    let saveData;
    var cartographic=Cesium.Cartographic.fromCartesian(signPointEntity._position._value);
    var lng=Cesium.Math.toDegrees(cartographic.longitude);
    var lat=Cesium.Math.toDegrees(cartographic.latitude);
    var alt=cartographic.height;
    if(type==1){
        signPointEntity.title=val;
        signPointEntity._label._text._value = val;
        let treeLabelNode=getNodeById(signPointEntity.id,layerMenu[3].children)
        treeLabelNode.title=val;
        $("#" + popId).children(".bx-popup-header-ctn")[0].innerText=val;
        saveData= {
            "id":signPointEntity._id,
            "type": "point",
            "longitude": signPointEntity._position._value.x,
            "latitude": signPointEntity._position._value.y,
            "height": signPointEntity._position._value.z,
            "longitude": lng,
            "latitude": lat,
            "height": alt,
            "content":signPointEntity.title,
        }
    }
@@ -852,9 +870,10 @@
        saveData= {
            "id":signPointEntity._id,
            "type": "point",
            "longitude": signPointEntity._position._value.x,
            "latitude": signPointEntity._position._value.y,
            "height": signPointEntity._position._value.z,
            "longitude": lng,
            "latitude": lat,
            "height": alt,
            "content":signPointEntity.title,
            "imagePath":newUrl,
        }
    }
@@ -1244,10 +1263,7 @@
}

function drawAjaxPoint(drawEntity){//加载点
    //
    let cartesian3 = Cesium.Cartesian3.fromDegrees(drawEntity.longitude, drawEntity.latitude, drawEntity.height);
    console.log(drawEntity.content,cartesian3.x,cartesian3.y,cartesian3.z)
    let cartesian=new Cesium.Cartesian3(parseFloat(drawEntity.longitude),parseFloat(drawEntity.latitude),parseFloat(drawEntity.height))
    let cartesian = Cesium.Cartesian3.fromDegrees(drawEntity.longitude, drawEntity.latitude, drawEntity.height);
    var cartographic = Cesium.Cartographic.fromCartesian(cartesian);
    var entity=viewer.entities.add({
        id:drawEntity.id,
@@ -1259,21 +1275,23 @@
            horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
            font: 'bold 14px Helvetica',
            fillColor: Cesium.Color.WHITE,
            text: "",
            text: drawEntity.content,
            verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
            horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
            disableDepthTestDistance: Number.POSITIVE_INFINITY,
            heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 200000000.0)
            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 10000000000000.0)
        },
        billboard: {
            image: "../assets/images/icon/icon1.png",
            width: 40,
            height: 40,
            rotation: 0,
            verticalOrigin: Cesium.VerticalOrigin.TOP,
            verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
            horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
            disableDepthTestDistance: Number.POSITIVE_INFINITY,//广告牌不进行深度检测
            disableDepthTestDistance: Number.POSITIVE_INFINITY,
            heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 200000000.0)
            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 10000000000000.0)
        }
    });
    if(drawEntity.content!=null&&drawEntity.content!=""){
@@ -1286,10 +1304,15 @@
        viewer:viewer,
        geometry:cartesian,
        entity:entity,
        id: "pop_" + entity.id
        id: "pop_" + entity.id,
        type:drawEntity.popType?drawEntity.popType:'image',
        content:drawEntity.popContent?drawEntity.popContent:null,
    })
    if( drawEntity.imagePath!=null&& drawEntity.imagePath!=""){
        $("#pop_" + entity.id).children(".bx-popup-content-ctn").children(".bx-popup-content").children(".image")[0].src = parent.httpConfig.webApiUrl+drawEntity.imagePath;
    }
    if( drawEntity.popContent!=null&& drawEntity.popContent!=""){
        $("#pop_" + entity.id).children(".bx-popup-content-ctn").children(".bx-popup-content").children(".textarea")[0].innerText = drawEntity.popContent;
    }
    document.getElementById("pop_" +entity.id).style.display="none";
    addTreeNode({
@@ -1313,7 +1336,7 @@
    let heightList=drawEntity.height.split(",");
    //点坐标
    for(let i=0;i<longitudeList.length;i++){
        let cartesian=new Cesium.Cartesian3(parseFloat(longitudeList[i]),parseFloat(latitudeList[i]),parseFloat(heightList[i]))
        let cartesian = Cesium.Cartesian3.fromDegrees(longitudeList[i], latitudeList[i], heightList[i]);
        measureLinePositonsArray.push(cartesian);
    }
    var drawpointArr = []; 
@@ -1351,7 +1374,7 @@
    let heightList=drawEntity.height.split(",");
    //点坐标
    for(let i=0;i<longitudeList.length;i++){
        let cartesian=new Cesium.Cartesian3(parseFloat(longitudeList[i]),parseFloat(latitudeList[i]),parseFloat(heightList[i]))
        let cartesian = Cesium.Cartesian3.fromDegrees(longitudeList[i],latitudeList[i], heightList[i]);
        polyPositions.push(cartesian);
    }
    var polygon = new Cesium.PolygonHierarchy();
@@ -1388,7 +1411,7 @@
}

function drawAjaxLabel(drawEntity){//加载文字
    let cartesian=new Cesium.Cartesian3(parseFloat(drawEntity.longitude),parseFloat(drawEntity.latitude),parseFloat(drawEntity.height))
    let cartesian = Cesium.Cartesian3.fromDegrees(drawEntity.longitude, drawEntity.latitude, drawEntity.height);
    var cartographic = Cesium.Cartographic.fromCartesian(cartesian);
    cartographic = Cesium.Cartographic.fromCartesian(cartesian);
    var entity = viewer.entities.add({

 assets/service/drawService.js

@@ -54,26 +54,34 @@
function saveDrawEntity(type,drawEntity,id){//zzf:保存绘制的图形
    let saveData;
    if(type=='point'){
        var cartographic=Cesium.Cartographic.fromCartesian(drawEntity._position._value);
        var lng=Cesium.Math.toDegrees(cartographic.longitude);
        var lat=Cesium.Math.toDegrees(cartographic.latitude);
        var alt=cartographic.height;
        saveData= {
            "id":id,
            "type": type,
            "longitude": drawEntity._position._value.x,
            "latitude": drawEntity._position._value.y,
            "height": drawEntity._position._value.z,
            "longitude": lng,
            "latitude": lat,
            "height": alt,
        }
    }
    else if(type=='polyline'||type=='polygon'){
        let longitudeList=[],latitudeList=[],heightList=[]
        for(let i=0;i<drawEntity.length;i++){
            longitudeList.push(drawEntity[i]._position._value.x)
            latitudeList.push(drawEntity[i]._position._value.y)
            heightList.push(drawEntity[i]._position._value.z)
            var cartographic=Cesium.Cartographic.fromCartesian(drawEntity[i]._position._value);
            var lng=Cesium.Math.toDegrees(cartographic.longitude);
            var lat=Cesium.Math.toDegrees(cartographic.latitude);
            var alt=cartographic.height;
            longitudeList.push(lng)
            latitudeList.push(lat)
            heightList.push(alt)
        }
        saveData= {
            "id":id,
            "type": type,
            "longitude": longitudeList.toString(),
            "latitude":latitudeList.toString(),
            "latitude": latitudeList.toString(),
            "height": heightList.toString(),
        }
    }
@@ -81,9 +89,9 @@
        saveData= {
            "id":id,
            "type": type,
            "longitude": drawEntity._position._value.x,
            "latitude": drawEntity._position._value.y,
            "height": drawEntity._position._value.z,
            "longitude": lng,
            "latitude": lat,
            "height": alt,
            "content":drawEntity.title,
            "color":drawEntity._label._fillColor._value.toCssColorString(),
            "fontsize":30,

 assets/utils/popup.js

@@ -10,17 +10,29 @@
    _this.geometry = info.geometry;//弹窗挂载的位置
    _this.id = info.id;
    _this.entity=info.entity;
    _this.type=info.type;
    _this.content=info.content;
    _this.ctn = $("<div class='bx-popup-ctn' id =  '"+_this.id+"'>");
    
    var entity={"id":_this.id,"dom":_this.ctn};
    Popup.prototype.dom.push(entity);

    $(_this.viewer.container).append( _this.ctn);
    //测试弹窗内容
    var testConfig = {
        header:_this.entity.title,
        //header:"",
        content:'<img class="image" style="width:100%;height:100%;max-width:200px;max-height:150px" src=""></img>'
    //弹窗内容
    var testConfig;
    if(_this.type=="image"){
        testConfig= {
            header:_this.entity.title,
            //header:"",
            content:'<img class="image" style="width:100%;height:100%;max-width:200px;max-height:150px" src=""></img>'
        }
    }
    else if(_this.type=="text"){
        testConfig= {
            header:_this.entity.title,
            //header:"",
            content:'<textarea class="textarea" style="color:white;width:100%;height:150px;max-width:200px;max-height:150px;background:transparent;"></textarea>'
        }
    }
    _this.ctn.append(_this.createHtml(testConfig.header,testConfig.content,_this.id));
    

 libs/Cesiumplus/CesiumDraw.js

@@ -493,6 +493,7 @@
                //     }
                // });
                let position = viewer.scene.camera.pickEllipsoid(movement.position, viewer.scene.globe.ellipsoid);
                let pointText="点" + new Date().format("yyyyMMddhhmmss");
                var entity=viewer.entities.add({
                    name:"drawPointEntity",
                    position:position,
@@ -502,7 +503,7 @@
                        horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
                        font: 'bold 14px Helvetica',
                        fillColor: Cesium.Color.WHITE,
                        text: "",
                        text: pointText,
                        disableDepthTestDistance: Number.POSITIVE_INFINITY,
                        heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
                        distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 200000000.0)
@@ -524,9 +525,11 @@
                    viewer:viewer,
                    geometry:cartesian,
                    entity:entity,
                    id: "pop_" + entity.id
                    id: "pop_" + entity.id,
                    type:'image',
                    content:null,
                })
                entity.title =  "点" + new Date().format("yyyyMMddhhmmss");
                entity.title =  pointText;
                addTreeNode({
                    "title": entity.title,
                    "id": entity.id,

 view/project/editPoint.html

@@ -13,7 +13,7 @@
            margin-top: 5px;
        }
        .labelInput {
            width: 150px;
            width: 180px;
            height: 30px;
            margin-left: 25px;
            margin-right: 50px;
@@ -81,8 +81,8 @@
                <input id="input" class="labelInput" type="text" placeholder="输入文字" autocomplete="off" oninput="labelChange(event)" onporpertychange="labelChange(event)"/>
            </div>
            <div>
                <span class="text">图片</span>
                <button type="button" class="layui-btn layui-btn-fluid layui-bg-black" style="height:30px;margin-top:10px;line-height: 30px;float: left;" id="uploadImg">
                <span class="text" style="margin-top: 10px;">图片</span>
                <button type="button" class="layui-btn layui-bg-black" style="width:180px;height:30px;margin-top:10px;margin-left: 25px;line-height: 30px;float: left;" id="uploadImg">
                    <i class="layui-icon">&#xe67c;</i>上传图片
                </button>
            </div>