大屏集成到场景

• 新建大屏，设置大屏大小为宽：80，高：40。

• 变量池 添加变量值

  • entityId：用于记录当前面板对应的实体 ID
  • scene_output_message：用于接收 3D 场景发送的消息
  

• 拖拽文本组件到画布上，并设置大屏背景图。

• 节点编程，页面加载完成通知 3D 场景

// 触发器内逻辑
window.parent.postMessage(
  {
    hetu: {
      dataPanelReady: HETU.getInteractVar('entityId')
    }
  },
  '*'
);

return true;

• 节点编程，监听 3D 场景推送数据信息，并显示在文本内

// 触发器内逻辑
const value = data['scene_output_message'];
const setVars = {
  title: value.eventData.entity.title
};

return [setVars];

• 大屏编辑完成，点击发布。

• 新建 3D 场景，拖拽模型到场景内，并设置模型名称。

• 在场景模型节点配置项，开启数据面板，并选择刚才发布的大屏。

  • 面板内容:选择发布发平
  • 面板大小:设置面板 IFrame 宽高，这里的 1 米对应 IFrame 10px。

• 3D 场景内集成大屏效果。