CesiumJS插件开发入门「Mixin」

boyanx2个月前技术教程8

一般来说,“插件”为软件增加了有用的功能。很多软件都支持自定义插件开发,比如QGIS,让广大用户对软件的功能有了极大的丰富。插件由软件的原始开发人员和其他想要扩展软件核心功能的独立用户编写。

1、CesiumJS插件 - Mixin

CesiumJS 引入了所谓的“Mixin”概念来扩展它的特性。我们可以从 CesiumJS API 文档中知道存在许多内置的 Mixin。

众所周知的第三方 CesiumJS Mixin 是“
viewerCesiumNavigationMixin”。它为 CesiumJS 3d 地图用户界面添加了非常有用的指南针、导航器和距离刻度小部件:

使用 Mixin 非常简单。我们只需像这样添加一行代码:

// extend our viewer by the cesium navigaton mixin
viewer.extend(Cesium.viewerCesiumNavigationMixin, {});

那么 CesiumJS 中的 Mixin 是什么?

简而言之,它只不过是一个纯 JavaScript 函数。我们可以从以下 CesiumJS 的源代码中查看:

2、如何制作CesiumJS Mixin?

为了解释如何制作自定义 Mixin,我制作了一个非常简单的 CesiumJS Mixin,用户可以使用它从鼠标位置检查经度和纬度。源代码已在此处发布。

它与CesiumJS Sandcastle 的picking示例非常相似

让我解释一下我的 Mixin 示例。

首先,我们创建一个新的 div 并将其附加到查看器的容器中。

接下来,我们创建 LatlonInspector,它是一个非常简单的带有两个按钮的小部件。

然后我们覆盖查看器的销毁函数,其中我们调用 LatlonInspector 的销毁函数以及查看器的原始销毁函数。

最后,我们使查看器具有 latlonInspector 属性,这有时可能很有用。

其余的代码很容易理解,所以在这里我将忽略它。

我希望你对 CesiumJS Mixin 有一个概念,并且你将来会做出很棒的 CesiumJS Mixin!


原文链接:
http://www.bimant.com/blog/cesiumjs-mixin-dev-tutorial/

标签: js插件

相关文章

优雅轻量级的网页alert弹窗美化插件 alertify.js

alertify.js是一款用于alert美化的插件,支持弹窗,提示,prompt,confirm等多种方式,并且调用简单,非常适合在项目中使用,也是切图网 qietu.com在前端切图项目中比较常用...

Grid.js - 跨框架的前端表格插件

只想简简单单画个表格,但 React,Vue,Angular,…,这么多前端框架,各自都有不同的表格渲染库。就没有表格库能“一次画表,到处运行”吗?来看看 Grid.js 这个跨框架的前端表格插件吧!...

前端开发神器:那些不容错过的插件推荐

在前端开发的浩瀚宇宙中,各种插件如繁星般闪耀,它们能够极大地提升开发效率,优化用户体验。今天,就来给大家推荐几款实用到爆的前端插件。一、swiper.js如果你需要在网页中创建一个酷炫的轮播图,swi...

前端资源-实用的JS插件

现在前端资源越来越多,有创意十足的,有实用性高的,这些对于设计师和前端人员来说都是不错的灵感和资源,所以我们可多关注这些信息,对自己的专业技术有也会帮助的。今天设计达人网为大家分享有:页面进度条、图像...

.NET CORE 抛弃IIS后可以做的事:JS调用本地硬件服务插件

在上一篇《.NET CORE 抛弃IIS,超便捷BS系统部署方案》一文中介绍了如何便捷部署BS系统,如果有朋友还不了解的,建议先看我主页的上一篇文章了解下。既然现在我们可以脱离IIS,以windows...

推荐7个高性能JavaScript代码高亮插件

对于喜欢写技术博客的同学来说,一定对代码高亮组件非常熟悉。一款优秀的JavaScript代码高亮插件,将会帮助你渲染任何一种编程语言,包括一些关键字的着色,以及每行代码的缩进等。今天我们要来分享一些高...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。