Forge view 自定义属性面板

Forge view 自定义属性面板思路比较简单
1.自定义面板并继承Autodesk.Viewing.Extensions.ViewerPropertyPanel
2.重写获取属性的方法，自定义来源
js代码如下：

class CustomPropsPanel extends Autodesk.Viewing.Extensions.ViewerPropertyPanel {
    constructor( viewer ) {
        super( viewer );
    }
    
    getRemoteProps( dbId ) {
        return new Promise(( resolve, reject ) => {
            fetch( "/BIM/getNodeAttr?id="+dbId, {
                method: 'get',
                headers: new Headers({
                    'Content-Type': 'application/json'
                })
            })
            .then( ( response ) => {
                if( response.status === 200 ) {
                  return response.json();
                } else {
                  return reject( new Error( response.statusText ) );
                }
            })
            .then( ( data ) => {
               if( !data ) return reject( new Error( '无法从服务器获取属性' ) );
            
               return resolve( data );
            })
            .catch( ( error ) => reject( new Error( error ) ) );
        });
    }
    
    async setNodeProperties( dbId ) {
        this.propertyNodeId = dbId;
        if( !this.viewer ) return;
        
        try {
            const data = await this.getRemoteProps( dbId );
            this.setTitle( data.title, { localizeTitle: true } );
            /*var aa = [{
            	"displayName":"新增属性",
            	"displayValue":dbId,
            	"displayCategory":"测试",
            	"attributeName":"新增属性",
            	"type":"20",
            	"units":null,
            	"hidden":false,
            	"precision":0
            }];*/
          
            this.setProperties( data.properties );
           
            this.highlight( this.viewer.searchText );
    
            this.resizeToContent();
    
            if( this.isVisible() ) {
                const toolController = this.viewer.toolController,
                mx = toolController.lastClickX,
                my = toolController.lastClickY,
                panelRect = this.container.getBoundingClientRect(),
                px = panelRect.left,
                py = panelRect.top,
                pw = panelRect.width,
                ph = panelRect.height,
                canvasRect = this.viewer.canvas.getBoundingClientRect(),
                cx = canvasRect.left,
                cy = canvasRect.top,
                cw = canvasRect.width,
                ch = canvasRect.height;
        
                if( (px <= mx && mx < px + pw) && (py <= my && my < py + ph) ) {
                    if( (mx < px + (pw / 2)) && (mx + pw) < (cx + cw) ) {
                       this.container.style.left = Math.round( mx - cx ) + 'px';
                       this.container.dockRight = false;
                    } else if( cx <= (mx - pw) ) {
                       this.container.style.left = Math.round( mx - cx - pw ) + 'px';
                       this.container.dockRight = false;
                    } else if( (mx + pw) < (cx + cw) ) {
                       this.container.style.left = Math.round( mx - cx ) + 'px';
                       this.container.dockRight = false;
                    } else if( (my + ph) < (cy + ch) ) {
                       this.container.style.top = Math.round( my - cy ) + 'px';
                       this.container.dockBottom = false;
                    } else if( cy <= (my - ph) ) {
                       this.container.style.top = Math.round( my - cy - ph ) + 'px';
                       this.container.dockBottom = false;
                    }
               }
          }
       } catch( error ) {
           this.showDefaultProperties();
       }
    }
}

在模型加载成功后的回调方法中new一个面板对象，并将该对象放入到模型对象viewer中

viewer.setPropertyPanel( new CustomPropsPanel( viewer ) );

获取dbId后，构建与属性面板交互如下：

 var customPropsPanel = viewer.getPropertyPanel();
 customPropsPanel.setNodeProperties(treeNode.id);

后台代码：

public JSONObject getNodeAttr(String id){
		JSONObject retObj = new JSONObject();
		JSONArray retArr = new JSONArray();
		Connection c = null;
		//String db = "C:\\Users\\Administrator\\Desktop\\工作\\BIM\\apache-tomcat-bim\\webapps\\ROOT\\output\\model.sdb";
		String db = "C:\\Users\\wangjinlong\\Desktop\\sqliteDatabase\\model.sdb";
		try {
			Class.forName("org.sqlite.JDBC");
			c = DriverManager.getConnection("jdbc:sqlite:" + db);
			c.setAutoCommit(false);
			System.out.println("Opened database successfully");
			Statement stmt = null;
	        stmt = c.createStatement();
	        //过滤掉系统属性
	        String sql = "select _objects_attr.category,"
	        		+ "(select (select value from _objects_val a where id = t.value_id )"
	        		+ " from _objects_eav t " 
	        		+ " where t.entity_id = _objects_eav.entity_id " 
	        		+ " and  (select name from _objects_attr where id =t.attribute_id ) ='name' ) title,"
	        		+ " _objects_attr.name,"
	        		+ " _objects_attr.data_type,"
	        		+ " _objects_val.id,"
	        		+ " _objects_val.value"
	        		+ " from _objects_eav, _objects_attr, _objects_val"
	        		+ " where _objects_eav.entity_id = '" + id + "' and"
	        		+ " _objects_eav.attribute_id = _objects_attr.id and"
	        		+ " _objects_eav.value_id = _objects_val.id"
	        		+ " and _objects_attr.flags != 1"
	        		+ " and _objects_attr.name !='name' "
	        		+ " group by _objects_attr.category,_objects_attr.name "
	        		+ " order by _objects_attr.category,_objects_attr.name";
	        ResultSet rs = stmt.executeQuery( sql );
	        
	     /*   var aa = [{
            	"displayName":"新增属性",
            	"displayValue":dbId,
            	"displayCategory":"测试",
            	"attributeName":"新增属性",
            	"type":"20",
            	"units":null,
            	"hidden":false,
            	"precision":0
            }];*/
	        retObj.put("title", "");
	        while ( rs.next() ) {
        		if("".equals(retObj.getString("title"))){
	        		retObj.put("title", rs.getString("title"));
	        	}
        		JSONObject tmpObj = new JSONObject();
        		tmpObj.put("displayName", rs.getString("name"));
        		tmpObj.put("displayValue", rs.getString("value"));
        		tmpObj.put("attributeName", rs.getString("name"));
        		tmpObj.put("displayCategory", rs.getString("category"));
        		tmpObj.put("type", rs.getString("data_type"));
        		tmpObj.put("units", "");
        		tmpObj.put("hidden", false);
        		tmpObj.put("precision", 0);
        		retArr.put(tmpObj);
	        	
	        }
	        retObj.put("properties", retArr);
	        rs.close();
	        stmt.close();
			c.close();
		} catch (Exception e) {
			System.err.println(e.getClass().getName() + ": " + e.getMessage());
			System.exit(0);
		}
		
		return retObj;
	}