aiot/3dModeling/zhhry20/FloorClick.js

//创建楼层选择器
function creatFloorChoose() {
    var floorsign =
        `<div id="floorChooseDiv" class="showFloorBtn">         
        
        <div value='close' onclick="handleSide()"  class ="closeIocn"  id='rightSideSwitch'></div>
        </div>`;

    $('#div2d').append($(floorsign));

    var car = app.query(".Floor")

    var html = ``
    for(let i = 0 ; i < car.length; i++){
        html +=
        `
        <div onclick="floorclick('${car[i].id}')" class = "showFloorBtns" id='${car[i].id}'>${car[i].id}</div> 
        `
    }
    $('#floorChooseDiv').append($(html));
    
    $('head').append($(`
        <style>
        .showFloorBtns{
            margin-bottom:6px;
            border:1px solid rgb(24,118,208);
            border-radius:4px;
            text-align:center;
            height:28px;
            line-height:28px;
            width:40px;
            color:rgba(255,255,255,0.5);
            background-color:rgba(24,144,255,0.3);
        //  display:inline-block;
                    }
        .showFloorBtn{
        position: absolute;
        // top:10px;
            top:calc(2%);
            right:-52px;
        // height:800px;
            width:50px;
            border-radius:0px;
            margin-top:0px;
                    }
        .closeIocn{
        //  margin-bottom:6px;
        //  border:1px solid rgb(24,118,208);
            border-radius:4px;
            text-align:center;
            height:30px;
            line-height:28px;
            width:40px;
            color:rgba(255,255,255,0.5);
            background-image: url(https://s3.ax1x.com/2021/01/29/yCR8dP.png);
            background-repeat:no-repeat;
            background-position:center center;
            position: absolute;
            top: calc(50%);
            left: -35px;

                }
                .active{
        background-color:red;
                }
        </style>
    `));
}
//楼层切换
function floorclick(id) {
    // test();
    //  delMydiv();
    //  floormen = id.id;
    //  building = app.buildings[0];
    //  var num = floormen.substring(1, 3);
    //  var s = parseInt(num);
    //  var floor = building.floors[s - 1];
    var floor = app.query("#" + id)[0];
    app.level.change(floor);
    // creatbutType(s);
    creatbutElement(id)
}
// 点击右侧侧边栏开关
function handleSide() {
    if ($('#rightSideSwitch').attr('value') == 'close') {
        $('.showFloorBtn').animate({ right: 0 }, 300);
        //  $('#rightSideSwitch').attr('value', 'open');
        $('#rightSideSwitch').attr('value', 'open').css('background-image', 'url(https://s3.ax1x.com/2021/01/29/yCRGIf.png)');
    } else if ($('#rightSideSwitch').attr('value') == 'open') {
        $('.showFloorBtn').animate({ right: -52 }, 300);
        $('#rightSideSwitch').attr('value', 'close').css('background-image', 'url(https://s3.ax1x.com/2021/01/29/yCR8dP.png)');
        //  $('#rightSideSwitch').attr('value', 'close');
    }