Panel的显示问题

廖茂彬 28天前 136

//加载场景代码
var app = new THING.App({ 
    // 场景地址
    "url": "http://www.thingjs.com/./uploads/wechat/5buW6IyC5b2s/scene/CB20190121182605",
    //背景设置
    "skyBox" : "BlueSky"
});

app.on('load', function () {
    renderHydrant();//渲染消防栓
});

var panel = null;// 统计面板
//仿造消防栓数据
var demoData = [
    {
        id: 1,
        position: [-60, 0, 0],
        angle: 0,
        title: null,
        wed: null,
    },
     {
        id: 2,
        position: [26, 0, 20],
        angle: 0,
        title: null,
        wed: null,
    },
     {
        id: 3,
        position: [60, 0, 42],
        angle: 0,
        title: null,
        wed: null,
    }
];
var demoDataInfo = [
    {
        title: '消防栓_001',
        dataNumber: 123,
    },
    {
        title: '消防栓_002',
        dataNumber: 456,
    },
    {
        title: '消防栓_003',
        dataNumber: 789,
    }
];

function renderHydrant(){
    for(var i=0;i<demoData.length;i++){
    // 创建Thing 
    var obj = app.create({ 
        type: 'Thing', 
        name: '消防栓_01',
        id: demoData[i]['id'],
        url: 'http://model.3dmomoda.com/models/298638300036400398675e7e4c35ef61/0/gltf/', 
    // 模型地址 
        position: demoData[i]['position'],
    // 位置 
        angle: demoData[i]['angle'],
    });
    }
}


// 给所有建筑对象,添加鼠标滑过事件
app.on('mouseon', '.Thing', '#0000FF', function (ev) {
       this.style.outlineColor = ev.data;
});
app.on('mouseoff', '.Thing', function (ev) {
       this.style.outlineColor = null;
});

app.on('click', '.Thing', '#0000FF', function (ev) {
    // alert(this);
    changeText(this);
});

function changeText(obj){
    // 创建widget (绑定数据用)
    var panel = new THING.widget.Panel({
        // 模板样式
        template: 'default',//模板样式提供两个样式 default 和 default2
        // 设置面板宽度
        width: '120px',
        //cornerType 角标样式 
        //没有角标none,没有线的角标noline,折线角标polyline,直线角标straightline
        cornerType: 'polyline'

    });

    var id_data = obj.id; //获取id值

    var name = demoDataInfo[id_data - 1]['title'];//根据id值获取到所需的name;
    var data_number = demoDataInfo[id_data - 1]['dataNumber'];//根据id值获取到所需的name;

    //绑定物体身上相应的属性数据
    panel.addString(name, 'name').caption('名称');
    panel.addString(data_number, 'power').caption('马力');


    // 创建UIAnchor面板
    var uiAnchor = app.create({
        // 类型
        type: 'UIAnchor',
        // 父节点设置
        parent: obj,
        // 要绑定的页面的 element 对象
        element: panel.domElement,
        // 设置 localPosition 为 [0, 0, 0]
        localPosition: [0, 0, 0],
        // 指定页面的哪个点放到localPosition位置上(百分比)
        pivot: [-0.2, 2.1]
    });

    // 将对应的 Panel 存下来 便于后续使用
    uiAnchor["panel"]=panel;

    return uiAnchor;
}

报错:Uncaught TypeError: Cannot create property 'name' on string '消防栓_003'。

获取到的数据该如何显示到panel中呢?

最新回复 (1)
  • 3D模模搭 28天前
    0 引用 2
    在群里已回复解决。

你可以在 登录 or 注册 后,对此帖发表评论!

返回