自定义脚本编辑器

本组件支持使用javascript来扩展场景功能

// lunar
const lunar = window.lunar
// 构建命令块
function buildCmdBlock (selector) {
  return {
    type: 'setAttributes', // 目前（2020-8-13）必须为setAttributes
    selector: selector, // css选择器字符串
    attributes: {}, // 需要设置的属性
    from: 'customScripts' // 非必须
  }
}
function onClick (selectCmdBlock) {
  console.log('custom', selectCmdBlock.selector)
  const cmdBlock = buildCmdBlock(selectCmdBlock.selector)
  cmdBlock.attributes.visible = false // 设置 可见:false
  lunar.execCmdBlock(cmdBlock) // 执行该命令块
}
lunar.on('select', onClick) // 将onclick 绑定到select上

function onStream (in1Raw) {
    console.log('onStream', in1Raw)
}
lunar.mq.stream.on('in1', onStream) // 将onStream  绑定到in1上

事件

目前支持的事件有

1. select

当三维对象配置有select属性，则该对象被鼠标选中后，会触发select事件

function onClick (selectCmdBlock) {
  console.log('custom', selectCmdBlock.selector)
}
window.lunar.on('select', onClick) // 将onclick 绑定到select上

2. stream

目前仅支持in1端口
对于线上版本，当后面板中该组件配置有输入连线时，则每当有新消息传入，会触发stream事件

function onStream (in1Raw) {
    console.log('onStream', in1Raw)
}
window.lunar.mq.stream.on('in1', onStream)

操作接口

目前支持的场景操作有

1. execCmdBlock

立即执行cmdBlock

window.lunar.execCmdBlock(cmdBlock) // 执行该命令块

命令块文档链接

2. queryEl

   通过queryEl可以快速获取指定对象

const el=window.lunar.queryEl('#mainModel') // 参数为合法 css 选择器
el.setAttribuet('visible',false) // 可以使用setAttribuet修改三维对象的属性(插件)

示例

使用 input 修改四方格的颜色
使用 select 修改对象的透明度

Q&A

如何获取和修改对象id