threejs(18) - 地图模型加载

在这里插入图片描述

GeoJSON是什么

如果你接触过数据可视化,那么大概率会知道GeoJSON。不知道?没关系,本文将为您娓娓道来!
GeoJSON是一种对各种地理数据结构进行编码的格式,基于Javascript对象表示法的地理空间信息数据交换格式。

官网: https://geojson.org/

中文翻译:https://www.oschina.net/translate/geojson-spec

GeoJSON对象

GeoJSON对象必须由一个名字为"type"的成员。
type成员的值必须是下面之一:“Point”, “MultiPoint”, “LineString”, “MultiLineString”, “Polygon”, “MultiPolygon”, “GeometryCollection”, “Feature”, 或者 “FeatureCollection”。
GeoJSON对象分为三种:几何对象、特征对象、特征集合对象
note: 下面的代码都可以在 geojson.io 查看效果,如下:

在这里插入图片描述

几何对象

GeoJSON支持以下几何类型:Point,MultiPoint,LineString,MultiLineString,Polygon,和MultiPolygon。
除了“GeometryCollection”外的其他任何类型的GeoJSON几何对象必须由一个名字为"coordinates"的成员。coordinates成员的值总是数组。这个数组里的元素的结构由几何类型来确定。

点(Point)
{ "type": "Point", "coordinates": [100.0, 0.0] }

多点(MultiPoint)

{
    "type": "MultiPoint",
    "coordinates": [
        [ 100, 0 ],
        [ 101, 1 ]
    ]
}

线 (LineString)

{
    "type": "MultiLineString",
    "coordinates": [
        [ [100.0, 0.0], [101.0, 1.0] ],
        [ [102.0, 2.0], [103.0, 3.0] ]
    ]
}

多边 (Polygon)

没有孔的:

{
    "type": "Polygon",
    "coordinates": [
        [
            [ 100, 0 ],
            [ 101, 0 ],
            [ 101, 1 ],
            [ 100, 1 ],
            [ 100, 0 ]
        ]
    ]
}

有孔的:

{
    "type": "Polygon",
    "coordinates": [
        [
            [ 100, 0 ],
            [ 101, 0 ],
            [ 101, 1 ],
            [ 100, 1 ],
            [ 100, 0 ]
        ],
        [
            [ 100.2, 0.2 ],
            [ 100.8, 0.2 ],
            [ 100.8, 0.8 ],
            [ 100.2, 0.8 ],
            [ 100.2, 0.2 ]
        ]
    ]
}

多多边(和MultiPolygon)

{
  "type": "MultiPolygon",
  "coordinates":
    [ 
        [[[102.0, 2.0], [103.0, 2.0], [103.0, 3.0], [102.0, 3.0], [102.0, 2.0]]],
        [
            [
                [100.0, 0.0], [101.0, 0.0], [101.0, 1.0], [100.0, 1.0], [100.0, 0.0]
            ],
            [
                [100.2, 0.2], [100.8, 0.2], [100.8, 0.8], [100.2, 0.8], [100.2, 0.2]
            ]
        ]
    ]
}

几何集合

{ "type": "GeometryCollection",
  "geometries": [
    { "type": "Point",
      "coordinates": [100.0, 0.0]
      },
    { "type": "LineString",
      "coordinates": [ [101.0, 0.0], [102.0, 1.0] ]
      }
  ]
}

特征对象

类型为"Feature"的GeoJSON对象是特征对象。
特征对象必须由一个名字为"geometry"的成员,这个几何成员的值是上面定义的几何对象或者JSON的null值。
特征对戏那个必须有一个名字为“properties"的成员,这个属性成员的值是一个对象(任何JSON对象或者JSON的null值)。
如果特征是常用的标识符,那么这个标识符应当包含名字为“id”的特征对象成员。

{
    "type":"Feature",
    "properties":{},
    "geometry":{ "type": "Point", "coordinates": [100.0, 0.0] }
}

特征集合对象

特征集合对象type为FeatureCollection。
类型为"FeatureCollection"的对象必须由一个名字为"features"的成员。与“features"相对应的值是一个数组。这个数组中的每个元素都是上面定义的特征对象。

{
  "type": "FeatureCollection",
  "features": []
}

坐标参考系统对象

GeoJSON对象的坐标参考系统(CRS)是由它的"crs"成员(指的是下面的CRS对象)来确定的。如果对象没有crs成员,那么它的父对象或者祖父对象的crs成员可能被获取作为它的crs。如果这样还没有获得crs成员,那么默认的CRS将应用到GeoJSON对象。

边界框

GeoJSON对象可能有一个名字为"bbox的成员。bbox成员的值必须是2*n数组,这儿n是所包含几何对象的维数,并且所有坐标轴的最低值后面跟着最高者值。

  • 20
    点赞
  • 22
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: Three.js是一个十分流行的WebGL渲染库,它可以用于在Web上创建各种各样的3D场景与动画。同时,Three.js也可以被用来加载BIM模型,让建筑师和工程师们获得全新的建筑设计和构建体验。 Three.js支持多种BIM格式,例如IFC、RVT和DWG等,使用Three.js加载BIM可以让用户在操作和构建场景时获得更为流畅的体验和更为生动的视觉效果。虽然BIM模型往往相较于其他模型更为复杂,但是Three.js以其高效优化和可定制化的特点,可以轻松地将模型呈现在Web页面上。 用户可以利用Three.js强大的工具箱,例如可拖拽的场景、可旋转的物体、自由视角等功能,让BIM模型在Web上愈发立体、真实。同时,用户还可以轻松地将BIM模型与其他的数据集成,例如地图数据、传感器数据和空气质量数据等等,以帮助设计师做出更加科学、可持续的设计决策。 总之,使用Three.js加载BIM模型不仅可以为用户构建更为真实、更为可视化的设计模型,更可以帮助设计师们在构建过程中得到更全面、更精准的数据支持,以满足日益严格的市场需求和客户要求。 ### 回答2: Three.js是一款现代的JavaScript 3D引擎,可以用于在Web浏览器中创建高品质的动态3D场景,因此它在加载BIM(建筑信息模型)方面也非常有用。 首先,BIM是一种数字建模技术,被用于建筑和基础设施项目的设计,建造和运行过程中的信息管理。因此,使用Three.js加载和展示BIM数据可以帮助设计师和建筑师更好地理解和管理整个建筑过程。 在使用Three.js加载BIM时,需要首先将BIM数据转换为可见的3D模型。这可以通过转换软件来完成,例如Revit和Navisworks等软件可以将BIM数据转换为3D格式,例如OBJ,FBX,GLTF等。 一旦有了可见的3D模型,就可以使用Three.js将模型加载进Web浏览器中,并附加材质,光源和动画等特性。此外,Three.js还可以帮助创建交互式场景,例如平移和缩放模型,或者添加文本,图表和注释等信息。 使用Three.js加载BIM可以提高建筑流程的效率,减少错误,并为设计师和建筑师提供更多的增值服务。 ### 回答3: Three.js是一款基于WebGL的JavaScript 3D图形库,它提供了高度抽象的对象、灵活的渲染管线和易于操作的场景,是Web 3D开发中的一种强大工具。而BIM(Building Information Modeling,建筑信息模型)是一种通过三维数字建模将建筑信息整合于一体,以提高建筑设计、施工、维护过程的效率和精度。 在Three.js中,可以通过加载BIM文件模型,让建筑模型变得更加生动、直观。Three.js支持的BIM文件格式主要有IFC、rvt等,并且可以通过插件的方式实现加载其他的格式。 Three.js可以支持解析IFC文件,对三维物体进行转换,生成渲染三维模型加载BIM文件可以通过将模型文件直接导入到项目中,利用Three.js提供的API将BIM模型加载到场景中。可以通过设置材质、贴图、光源、相机等参数来实现丰富的效果,从而方便地展示模型细节。 总之,利用Three.js加载BIM文件,可以让建筑模型更直观、动态,从而方便用户快速了解建筑设计;同时通过Three.js的灵活性,开发人员可以自由地调整模型的渲染效果,满足不同需求。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值