anyonesdk v1.0.11

Anyone 数字孪生+BIM引擎

核心对象（class）

Class :App

App Anyone引擎的入口，提供初始化功能。

new App(options) → {App}

Example

<canvas id="canvasContainer" class="webgl"></canvas>

// 引擎初始化
let app;//在vue外声明viewer，否则执行效率将大打折扣
...
app = new AnyOne.App({
    container: 'canvasContainer',//
    url: 'http://xxx.xxx.xxx.xxx:xxxx/cimops/scence/factory/1',
    background: '#333',
    stats: true,
    helper: true,//方向指示器
    complete: () => {
        console.log('is load finish', 1)
    }
});

background :String|Number

背景颜色或者图片, 参数为RGB颜色值 或 十六进制颜色值 或 图片资源路径

Example

app.background(0xFF00FF)
app.background('#FF00FF')
app.background('rgb(255,0,255)')
app.background('http://www.thingjs.com/static/images/background_img_03.png')

fog :Object

Example

// 线性雾
app.fog({color: '0x888888', near: 1, far: 100})
// 清除雾
app.fog(null);

isMobileDevice :Boolean

判断是否为移动端设备

Example

console.log('isMobileDevice', app.isMobileDevice()) //true or false

lighting :Object

设置灯光

ambientLight
环境光

hemisphereLight
一种直接位于场景上方的的光源，颜色从天空颜色逐渐褪色到地面颜色 不能用于投射阴影

directionalLight
沿特定方向发出光，一般模拟日光

pointLight
从过一个点向四面八方飞出的光，能投射阴影

spotLight
聚光灯

Example

     let options = {
    ambientLight: {
        intensity: 0.5,
        color: 0xffffff
    },
    hemisphereLight: {
        intensity: 0.5,
        color: 0xffffff,
        groundColor: 0x222222
    },
    directionalLight: {
        color: 0xffffff,
        intensity: 0.5,
    },
    pointLight: {
        color: 0xffffff,
        intensity: 0,
        distance: 12,
        decay: 1.5
    },
    spotLight: {
        color: 0xffffff,
        intensity: 0,
        distance: 12,
        angle: 0,
        penumber: 0.5,
        decay: 0.5,
        position: {x: 0, y: 10, z: 0}
    }
}
app.lighting(options)

pixelRatio :Number

设置/获取像素比 默认为1，可设置为0-1之间的数值 数值越大，渲染效果越清晰（帧率降低）， 数值越小，渲染效果越模糊（帧率提高） 在移动设备上，为了渲染帧率，可将 app.pixelRatio 设置成小于1的值

Example

app.pixelRatio(0.8)

skyBox :String

设置天空盒 注意: 图片的宽高比必须1:1,目前仅限于png,jpg,jpeg格式

Example

 app.skyBox('./images/Sky/skyBox.jpg')

Class : CameraController

摄像机类，通过 app.cameraSet 获取摄像机对象

position :String

直接设置相机位置

Example

app.cameraSet({position: {x: 0, y: 0, z: 30}});

lookAt :String

相机朝向

Example

app.cameraSet({lookAt: {x: 0, y: 0, z: 30}});

zoom (distance)

向前/向后移动摄像机

 app.zoom({distance: 10})

cameraMove (step)

向右/向左移动摄像机

  app.cameraMove(60);

cameraRotate (state, speed)

摄像机围绕中心点旋转

  app.cameraMove(60);

PolarAndAzimuth

摄像机俯仰角和水平角度限制

      // 限制最大俯仰角度
app.controls.minPolarAngle = 0;
app.controls.maxPolarAngle = (50 * Math.PI) / 100;
// 左右旋转范围
app.controls.maxAzimuthAngle = 0;
app.controls.minAzimuthAngle = (85 * Math.PI) / 100;

Class : BaseObject

BaseObject 物体基类

scale :Array

物体自身缩放比例

Example

 app.BaseObject({scale: [2, 2, 2]})  

visible :Boolean

设置/获取 物体显示隐藏状态

 app.BaseObject({visible: false})  

destroy :Boolean

销毁自身及其所有子物体(递归删除)

 app.BaseObject({destroy: true})   

Class : AnyThings

AnyThings 非建筑物外的基类

scale :Array

物体自身缩放比例

Example

 app.AnyThings({scale: [2, 2, 2]})  

visible :Boolean

设置/获取 物体显示隐藏状态

 app.AnyThings({visible: false})  

destroy :Boolean

销毁自身及其所有子物体(递归删除)

 app.AnyThings({destroy: true})   

Class : Points

标注内容，纯文字标注，图片标注，自定义内容标注

let interactablePoints = [
    {
        key: 1, value: '纯文字提示内容', type: 'TextRegion', location: {x: 30, y: 35, z: 30},
        parameters: {
            fontsize: 60,
            fontface: 'Microsoft YaHei'
        },
        scale: {x: 5, y: 5, z: 5},
        animate: 'jump'
    },
    {
        key: 2, value: '/model/warning.png',
        type: 'Img',
        location: {x: 30, y: 10, z: -30},
        scale: {x: 8, y: 8, z: 8},
        animate: 'jump'
    },
    {
        key: 3, value: '/model/flamexDialog.png',
        text: '图文结合形式的提示内容',
        type: 'Both',
        location: {x: 31, y: 35, z: 10},
        w: 180,
        h: 28,
        animate: 'jump'
    },
]

app.Points(interactablePoints)   

Class : Iframe

内嵌页面

   app.Iframe({
    w: 480,
    h: 320,
    x: 60,
    y: 20,
    url: 'http://www.weather.com.cn/weather1d/101120101.shtml',
    id: 'iframe-1',
})  

Class : Video

内嵌页面

  app.Video({
    w: 40,
    h: 30,
    x: 60,
    y: 20,
    rotaX: 0,
    rotaY: 90,
    rotaZ: 0,
    src: '/model/video.mp4',
    id: 'Video-1',
    isLoop: true,
})

Class : Audio

内嵌页面

  app.Audio({
    src: '/model/alert.mp3',
    isLoop: true,
    Vol: 0.5,
})

Class : FlyLight

内嵌页面

   // 路径
const pointList = [
    {x: -400, y: 10, z: -200},
    {x: -50, y: 10, z: -50},
    {x: 50, y: 10, z: -250},
    {x: 300, y: 10, z: -50},
    {x: 350, y: 10, z: -50},
    {x: 500, y: 150, z: -200},
    {x: 600, y: 0, z: -200},
];
app.FlyLight({
    pointList: pointList,
    length: 30,
    circle: 6,
    color: "#00a3ee",
    opacity: 0.5,
    size: 15,
});

Class : click

点击事件
showTips 弹窗提示

      let showTips = true;
window.addEventListener('click', event => {
    app.click(event, showTips, function (res) {
        console.log('res', res)
    })
}, false)

特效

Class : FlyLight 流光飞线

流光飞线

      const pointList = [
    {x: 27, y: 3, z: 57},
    {x: 27, y: 3, z: -27},
    {x: -27, y: 3, z: -27},
    {x: -27, y: 3, z: 57},
];
app.FlyLight({
    pointList: pointList,
    length: 10,
    circle: 6,
    color: "#00a3ee",
    opacity: 0.8,
    size: 6,
});

Class : outlineObj 描边

模型描边特效

     app.outlineObj(Object)

Class : Cloud 云雾

生成流动的云

      // 移动云
app.Cloud({
    position: {
        x: 20,
        y: 46,
        z: 26,
    },
    goal: {
        x: -10
    },
    scale: {
        x: 16,
        y: 16,
        z: 16,
    },
    spendTime: 7500
})

Class : Rain 下雨

下雨动画

   app.Rain({
    min: {
        x: -80,
        y: 0,
        z: -80
    },
    max: {
        x: 60,
        y: 100,
        z: 60
    },
    opacity: 0.33,
    vol: 2000,
})

Class : Wander 漫游

第一人称漫游

let params = {
    speed: 0.01,//移动速度
    rotateSpeed: 2.5,//转弯速度
    fly: true,//允许飞行
}
app.Wander(params)

Class : PlanWander 规划漫游

按照点位进行漫游

let paths = [{
    position: {x: 63, y: 6, z: 63},
    target: {x: 0, y: 6, z: 0},
    duration: 7000
}, {
    position: {x: 63, y: 6, z: 0},
    target: {x: 40, y: 6, z: 0},
    duration: 3000
}, {
    position: {x: 63, y: 6, z: -63},
    target: {x: 40, y: 6, z: 0},
    duration: 5000
}, {
    position: {x: 63, y: 6, z: 0},
    target: {x: 40, y: 6, z: 0},
    duration: 3000
}, {
    position: {x: 130, y: 6, z: 0},
    target: {x: 0, y: 6, z: 0},
    duration: 3000
},]

app.PlanWander(paths)

Class : Wall 光墙

光墙

let params = {
    position: {
        x: 0,
        y: 0,
        z: 0
    },
    speed: 0.01,
    color: '#45ff3b',
    opacity: 0.9,
    radius: 40,
    height: 20,
}

app.Wall(params)

动画

Class : Door 开关门

推拉 开关门动画

let params = {
    position: {
        x: 13.5,
        y: 0,
        z: 21
    },
    speed: 1,
    doorColor: '#10180d',
    FrameColor: '#131c0e',
    openRotate: 1,
    duration: 3,
    imgSrc: "./model/door.jpg",
}

app.Door(params)

Class : Fire 火焰

火焰效果

let params = {
    position: {
        x: 17,
        y: 19.5,
        z: 18.5
    },
    size: 5,
    opacity: 0.8,
}

app.Fire(params)

版本记录

API更新日志

v1.0.7 2023-2-1

修复部分bug

v1.0.4 2022-12-2

新增 增加开关灯时光锥的位置设置 增加了标注的大小调节

修复 修复了加载动画的加载方式，兼容更多调用方式；

v1.0.3 2022-11-4

新增
火焰

v1.0.2 2022-10-25

新增
雨天，云雾，描边特效

v1.0.1 2022-10-15

新增
初始化框架内容