Cesium 是一款面向三维地球和地图的，世界级的JavaScript开源产品。它提供了基于JavaScript语言的开发包，方便用户快速搭建一款零插件的虚拟地球Web应用，并在性能，精度，渲染质量以及多平台，易用性上都有高质量的保证。

我们知道，Cesium可以通过Entity来加载Gltf模型，但是一旦加载的模型数据量过大，就会造成浏览器卡顿，甚至崩溃。

有一种场景，比较特殊，例如，可视化一条马路两侧的树木在春夏秋冬四季的情况，每隔100米放置一个垃圾桶等等。这类场景加载的模型数量巨大，如果一个一个的加载，势必会导致网页卡顿，这时我们需要使用ModelInstanceCollection这个API了。

效果图

1. 定义模型所处位置集合

  • var treePositions = [
  • [116.37937798457553, 39.90639040824304],
  • [116.37926582917692, 39.90632075459136],
  • [116.37902230222204, 39.90627035636522],
  • [116.37874168213100, 39.90624505983880]
  • ......
  • ];

2. 构造instances

更多详情见下面链接文章：

文章链接

对本专栏感兴趣的话，可以关注一波

Cesium专栏-大量gltf三维模型加载的更多相关文章

  1. Cesium如何通过addImageryProvider方法加载SkylineGlobe Server发布的WMS服务

    某某某单位用SkylineGlobeServer7版本发布了好些服务,然后让我们在Cesium里都加载进来展示. 其实只要符合OGC标准的,加进来还是很容易的. 示例代码如下: function te ...

  2. Cesium随笔（2）加载天地图地图服务【转】

    Cesium自带的图层是bing地图和esri,mapbox等图层,木有中文注记,想加载中文注记的图层?废话不说,上代码: var viewer = new Cesium.Viewer('cesium ...

  3. vue+cesium初探（一） 加载cesium

    参考文章1:https://www.cnblogs.com/laixiangran/p/4984522.html 参考文章2:https://blog.csdn.net/weixin_41940497 ...

  4. osg 三维模型加载与解析(fbx、3ds、ive、obj、osg)

    void TeslaManage::OnlineTreeViewDoubleClick(const QModelIndex & index) { int row = index.row(); ...

  5. osg qt 三维模型加载

    osg::ref_ptr<osg::Node> OSG_Qt_::operateMatrix() { osg::ref_ptr<osg::Group> group = new ...

  6. cesium js学习一加载三维模型【转】

    http://blog.csdn.net/tangyajun_168/article/details/50936698 最近项目中用到室外三维模型与室内三维地图交互,室外三维模型的加载我们采用了ces ...

  7. cesium初探之加载三维模型

    项目需要用到二三维地图切换,本来准备研究ArcGIS js for Web 3d,但考虑到版权的问题,决定试着用cesium来做,于是花了2天时间抱着试试看的心态把cesium从环境配置到加载三维模型 ...

  8. Cesium加载三维倾斜摄影数据

    具体技术来源自论文 基于Cesium的倾斜摄影三维模型Web加载与应用研究. 技术架构图 应用实例 利用一个实际实例来详细说明如何利用Cesium加载倾斜摄影数据,并进行可视化和交互操作. 首先,利用 ...

  9. cesium 学习(五) 加载场景模型

    cesium 学习(五) 加载场景模型 一.前言 现在开始实际的看看效果,目前我所接触到基本上都是使用Cesium加载模型这个内容,以及在模型上进行操作.So,现在进行一些加载模型的学习,数据的话可以 ...

随机推荐

  1. PHP路径指定web路径的方法

    PHP路径指定web路径的方法直接在/前面加.就是代表web路径了 不是按照文件路径来算了 <pre>./Public/uploads/suolutu/' . $suijishu . '_ ...

  2. 006.Kubernetes二进制部署ETCD

    一 部署ETCD集群 1.1 安装ETCD etcd 是基于 Raft 的分布式 key-value 存储系统,由 CoreOS 开发,常用于服务发现.共享配置以及并发控制(如 leader 选举.分 ...

  3. RabbitMQ 的高可用集群

    RabbitMQ 的高可用性 RabbitMQ 是比较有代表性的,因为是基于主从(非分布式)做高可用的 RabbitMQ 有三种模式:单机模式.普通集群模式.镜像集群模式. 单机模式 单机模式,生产几 ...

  4. 2019年PHP面试题附答案（实战经验）

    出于一些原因近期做了一次工作变动,在职交接近一个半月时间大概面试了十五家公司,并且得到了自己比较满意的offer,最后基本上无缝衔接了新工作.总体来说,虽然准备的很充分,但面试期间还是暴露了许多问题, ...

  5. CSS中越界问题的经典解决方案

    (1)如何解决父元素的第一个子元素的margin-top越界问题 1)为父元素加border-top: 1px;——有副作用 2)为父元素指定padding-top: 1px;——有副作用 3)为父元 ...

  6. 力扣（LeetCode）颠倒二进制位 个人题解

    颠倒给定的 32 位无符号整数的二进制位. 示例 1: 输入: 00000010100101000001111010011100 输出: 0011100101111000001010010100000 ...

  7. python：爬虫1——实战（下载一张图片、用Python模拟浏览器，通过在线的有道词典来对文本翻译）

    一.下载一只猫 import urllib.request response = urllib.request.urlopen("http://cdn.duitang.com/uploads ...

  8. router-link传递参数

    有个功能: 依据传入值,跳到产品详情页,但是详情页的内容依据传入值来相应变化. 如果使用点击事件@clic来实现,则有三个重复的跳转代码. 避免多次定义重复函数,可以使用router-link 传参数 ...

  9. 研究Java语言的编译器和虚拟机源代码

    现在使用Java语言的人很多,但是了解Java语言实现的人非常少.如果要研究Java语言的实现,推荐研究Javac和虚拟机HotSpot的源代码实现,其中Javac相当于Java编译的前端,HotSp ...

  10. web前端之css基础

    CSS选择器 元素选择器 p{color:red;} ID选择器 #li{ background-color:red; } 类选择器 .c1{ font-size:15px; } 注意: 样式类名不要 ...