CesiumJS에서 지도 위에 올려진 Object에 값을 지정하고 Object 클릭시 등록된 값 받아오기

billboard와 box에 사용자 정의 properties를 사용해 보았다.
이유는 모르겠지만 등록된 properties 값은 아래처럼 읽어올 수 있었다.
billboard에 등록된 프로퍼티 --> pickedObject.primitive.id.properties.level._value
box에 등록된 프로퍼티 --> pickedObject.id.properties.direction._value

지도위에 Object 추가하는 부분 (전체 코드 중 주요부분 일부)

//POI 그리기
viewer.entities.add({
    name : 'poi'
    position : position,
    properties : new Cesium.PropertyBag({
        seq:result.poiList[i].seq, coordinatex:coordinatex, coordinatey:coordinatey, level:level,
        title:result.poiList[i].title, url:result.poiList[i].url, moddate:result.poiList[i].moddate,
        videocnt:result.poiList[i].videocnt, modelcnt:result.poiList[i].modelcnt, imagecnt:result.poiList[i].imagecnt,
        totalcnt:result.poiList[i].totalcnt
    }, undefined), //사용자 정의 변수값 추가
    billboard : { //임의의 이미지를 POI로 사용
        image : '../img/icon/ic_pin_drop_24px.png',
        scale : 1.0,
        horizontalOrigin : Cesium.HorizontalOrigin.CENTER,
        verticalOrigin : Cesium.VerticalOrigin.BASELINE,
        disableDepthTestDistance : Number.POSITIVE_INFINITY //0.0 : 깊이에 따라 파묻힘(default). Number.POSITIVE_INFINITY : 항상 보임
    }
});

//box 그리기
viewer.entities.add({
    name : 'PST001001',
    position : tposition,
    orientation : torientation,
    properties : new Cesium.PropertyBag({
        direction:result.poiList[i].direction
    }, undefined), //사용자 정의 변수값 추가
    box : {
        dimensions : new Cesium.Cartesian3(30.0, 0.001, 22.5),
        heightReference : Cesium.HeightReference.RELATIVE_TO_GROUND,
        outline : true,
        outlineColor : Cesium.Color.WHITE,
        outlineWidth : 2,
        material : fileNm
    }
});

지도위의 Object 선택시 이벤트 처리하는 부분 (전체 코드 중 주요부분 일부)

handler.setInputAction(function(movement) {
    var pickedObject = viewer.scene.pick(movement.position);
 
    console.log("pickedObject : ",pickedObject);
    console.log("pickedObject.primitive : ",pickedObject.primitive);
    console.log("pickedObject.primitive.id.properties.level._value : ",pickedObject.primitive.id.properties.level._value);
    console.log("pickedObject.id : ",pickedObject.id);
    console.log("pickedObject.id.name : ",pickedObject.id.name);
    console.log("pickedObject.id.properties.direction._value : ",pickedObject.id.properties.direction._value);
 
    //지도 위 맨바닥 클릭시
    if (!Cesium.defined(pickedObject)) {
        /*
        pickedObject : undefined
        pickedObject.primitive : undefined
        pickedObject.primitive.id.properties.level._value : undefined
        pickedObject.id : undefined
        pickedObject.id.name : undefined
        pickedObject.id.properties.direction._value : undefined
        */
    }
    //지도 위에서 POI 클릭시
    else if (Cesium.defined(pickedObject.id.name) && pickedObject.id.name === 'poi') {
        /*
        pickedObject : Object
        pickedObject.primitive : Object
        pickedObject.primitive.id.properties.level._value : defined
        pickedObject.id : Object
        pickedObject.id.name : defined
        pickedObject.id.properties.direction._value : undefined
        */
    }
    //지도 위에서 box 클릭시
    else if (Cesium.defined(pickedObject.id.name) && pickedObject.id.name === 'PST001001') {
        /*
        pickedObject : Object
        pickedObject.primitive : Object
        pickedObject.primitive.id.properties.level._value : undefined
        pickedObject.id : Object
        pickedObject.id.name : defined
        pickedObject.id.properties.direction._value : defined
        */
    }
    //지도 위에서 tileset 등의 기타 Object 클릭시
    else {
        /*
        pickedObject : Object
        pickedObject.primitive : Object
        pickedObject.primitive.id.properties.level._value : undefined
        pickedObject.id : undefined
        pickedObject.id.name : undefined
        pickedObject.id.properties.direction._value : undefined
        */
    }

}, Cesium.ScreenSpaceEventType.LEFT_CLICK);