全局globe属性

2020-06-29  本文已影响0人  Mr桔子先生

前一节提到了Vue.$globe自定义属性,这一节着重来介绍设计这个自定义属性的初衷和用法。

Vue的MVVM架构的一个核心功能就是数据的绑定,将部分数据在data属性中进行监听,大多数开发者在使用SuperMap iClient3D for WebGL和Vue进行结合开发时,会情不自禁的将viewer、scene等和场景相关的对象放在data中监听,方便参数的传递和使用。由于data的监听机制,以及viewer、scene等的刷新机制,直接导致场景帧率低下,场景浏览卡顿,也就说不能讲viewer、scene等放置到data中进行监听,那vue组件之间需要传递viewer、scene等参数时如何实现?这就引申出Vue.$globe属性设计的构想。

通过全局设置改属性,可以在任意vue组件中获取到该属性,也就方便了后续的调用。

//资源路径
//后续会添加全局的Viewer属性
//静态资源,需放置到static目录
const CesiumPath = "./static/Cesium";///Cesium.js
// const csspath = "./static/Cesium/Widgets/widgets.css";
const prettycsspath="./static/Cesium/pretty.css"

export default{
    CesiumPath,
    prettycsspath
}
 this.$set(this.$globe, "viewer", viewer);
 this.$set(this.$globe, "scene", viewer.scene);

由于前面提到Cesium资源的加载是异步的,viewer的初始化也是需要时间的,在其他组件初始化时并不能在初始化时就获取到viewer、scene等参数,在后续的组件开发过程中将讲解如何实现。

上一篇下一篇

猜你喜欢

热点阅读