当垂直形态改变人们对某个地点的理解时,3D 地图就显得尤为重要。地形可以展现坡度,拉伸的建筑物可以展现城市体量,而倾斜的相机视角则可以清晰地呈现在 2D 平面上难以辨认的事物关系。深度并非总是更优:只有当第三维度能够提升实际决策时,产品才应该添加深度信息。Kaleidr Studio 目前记录了 3D 地形、真实高程、山体阴影和拉伸的建筑物,以及自定义底图、图层、实时数据和发布流程。
以下章节将介绍深度何时发挥作用、工作室当前的公开 3D 合同、地形、山体阴影和拉伸模型的区别、权威的高程和高度数据、相机和标签设计、创作工作流程以及故障模式。相关阅读材料包括如何构建自定义品牌底图、AI交互式地图构建器、地图发布指南、如何嵌入交互式地图和数字地图。已确定产品方案的团队可直接跳至工作室合同和创作流程;仍在二维和深度地图之间进行选择的团队应从决策测试开始。
三维地图要点
- **深度必须改变决策:**地形、海拔或建筑体量应能解答平面地图无法解答的问题。
- **山体阴影并非地形:**阴影可以显示地形起伏,而表面保持平坦;倾斜的地形会改变几何形状。
- **海拔和高度保持权威:**视觉真实感并不代表测量精度。
- **业务图层保持最高:**物业、商店、资产和服务区域仍然是主要信息。
- 确认产品合同: Studio记录地形、山体阴影和拉伸建筑物,而非任意导入的3D模型。

什么是 3D 地图?
三维地图通过高程、地形、透视、拉伸的建筑物或其他三维几何体来呈现垂直空间信息。许多被描述为三维的网络产品实际上是 2.5D:一个倾斜的相机、一个地形表面和拉伸的多边形,而不是一个包含任意网格、自定义光照和对象级交互的完整场景。这种可控的深度通常足以满足房地产、旅游、基础设施和城市环境地图的需求。完整的三维场景可以等到产品真正需要自定义模型时再考虑。
一个有用的检验标准是垂直形态是否会改变用户的任务。坡度可以决定路线或施工方法。周围的建筑体量可以改变房源信息的呈现方式。景观特征可以改变用户在到达目的地之前对其的理解。如果第三维度不能改善这些问题的答案,那么数字地图产品就应该保持扁平化。装饰性的倾斜并非产品的功能。
三维地图何时能改善产品决策?
增加地图深度的一个错误理由是追求视觉冲击力。更恰当的问题是,地图增加深度后,哪些内容更容易理解。当路线、地点或资产位于斜坡、山脊或高程变化处时,地形信息就显得尤为重要。当城市密度、高度和街区结构成为决策考量因素时,立体建筑信息则能发挥作用。只有当标签、标记和叠加层争夺像素后,这些关系仍然清晰可辨时,倾斜视角才能发挥作用。
地形信息对于户外旅游、山坡地产、基础设施以及对海拔高度敏感的物流项目通常都很有价值。立体建筑信息可以通过将选定地点与周围环境进行对比,帮助房地产、开发、建筑设计、校园地图和城市叙事更好地呈现。密集型运营定位器、简易商店搜索和移动优先的查找器通常在二维地图中更清晰,因为标记、标签和服务区域不会被遮挡。使用能够传达所需形式的最小深度即可。
| 需要 | 推荐方法 |
| --- | --- |
| 显示坡度或地形 | 地形和山体阴影 |
| 添加细微的地形背景 | 先进行山体阴影处理 |
| 显示城市体量 | 建筑拉伸 |
| 突出显示商业多边形 | 先进行二维处理;仅当高度增加意义时才进行拉伸 |
| 讲述一个视觉故事 | 适中的俯仰角和受控的相机 |
| 密集型操作仪表板 | 受限的 2D 或 2.5D |
| 移动优先定位器 | 低俯仰角或 2D |
| 高端房产或旅游体验 | 3D 可以很有价值 |
| 精确的空间测量 | 分析,而非视觉深度 |

Kaleidr Studio 目前记录了哪些 3D 功能?
Kaleidr Studio 目前在其 Studio 优势中列出了 **3D 可视化 **,并表示团队可以“添加 3D 地形、真实海拔和拉伸建筑物,以便观众一目了然地了解任何景观”(用于品牌交互式地图的 AI 地图制作工具)。同一页面将山体阴影与海拔和 3D 建筑物并列,并指出“地形、山体阴影和拉伸建筑物均基于真实海拔数据构建”。这段文字权威地表明了 Kaleidr 自身的定位。以下架构将这四个表面视为公共契约,并且不会创建页面未描述的导入路径。
Studio 将 3D 可视化与自定义地图图块、品牌底图、实时数据图层、可重用图层和数据集以及发布功能置于同一环境中。3D 体验仍应遵循与产品其他部分相同的自定义品牌底图层级结构:土地、道路、标签、选定州/省,然后是业务叠加层。即使高程源是真实的,将看起来像是通用地形渲染器直接嵌入到品牌地图中的深度效果也是一种设计缺陷。
Studio 的常见问题解答目前指出,地图可以发布为独立页面,也可以嵌入为组件。以提示为先的创作方式可以缩短从构思到设计地图的距离,例如在AI 交互式地图构建器工作流程中。语言模型可以帮助请求或安排可视化;海拔、建筑高度和业务数据仍然是真实可靠的来源。请勿将渲染后的屏幕截图视为测量值。
地形、山体阴影和建筑物之间有何区别?
地形会根据海拔改变渲染表面,因此地图不再是平面。山体阴影模拟海拔上的光影变化,使地形起伏更容易感知;地图可以使用山体阴影,而无需完全模拟倾斜地形。拉伸的建筑物赋予其轮廓多边形高度,使其从地图中凸起。任何具有有意义数值的多边形都可以拉伸,但并非每个数值字段都应该变成 3D 柱状图。只有当用户能够读取比例尺、比较特征并以文本形式理解相同信息时,以高度形式呈现的销售额、产能或强度才有意义。
MapLibre GL JS 目前通过 raster-dem 源、terrain 样式块、山体阴影和 TerrainControl(3D 地形)以实际 3D 形式显示海拔。该示例的标题是“超越山体阴影,以实际 3D 形式显示海拔”,这也是产品设计师应该注意的区别。MapLibre 样式规范将地形 exaggeration 定义为一个可选数字,默认值为 1,用于描述地形的视觉高度(地形)。夸张的数值可以使细微的地形起伏更容易被观察到。如果精度要求高,请务必明确标明,避免将场景视为测量表面,并确保所有比较设置保持一致。
对于印刷风格的编辑地图、广阔的区域视图、包含大量标签的地图以及低端设备,山体阴影就足够了。地形和山体阴影可以协同工作:几何图形提供地形起伏,阴影提供视觉提示。注意不要让阴影掩盖道路、边界或商业图层。对于普通的城市商店搜索,地形通常作用不大。

为什么高程和高度数据必须保持权威性?
三维地形图需要高程数据。地形几何形状来源于此,而非由语言模型凭空捏造的山丘。MapLibre 中的建筑示例使用了一个由建筑高度属性(例如 render_height 和 render_min_height)驱动的 fill-extrusion 图层(以三维方式显示建筑物)。Mapbox 文档记录了相同的样式模式:在样式中包含三维建筑物,包括通过从建筑物源数据创建填充拉伸图层来实现(Mapbox 样式中的三维建筑物)。这些页面展示了 Web 地图如何拉伸建筑物轮廓。 MapLibre 和 Mapbox 文档并非 Kaleidr Studio 的创作用户界面,它们无法精确地填充缺失的高度值。
精美的拉伸效果可以给人以精准的印象。但请务必确认高程数据源是否为最新数据,建筑物高度是实测值还是估算值,覆盖范围是否完整,垂直单位是否一致,以及缺失值是否显而易见。如果缺少高度数据,产品不应假定每栋建筑物都具有精确的实际高度。3D 地图可以使模式更容易被感知,但它不会自动量化平均海拔、面积、坡度、距离或建筑物数量。对于这些问题,请使用确定性分析方法。Studio 地图是一种面向产品的交互式体验,不能替代 GIS 预处理、地形分析或数据质量保证。
MapLibre 目前记录了如何使用 three.js 将模型放置在地形上的自定义 3D 图层(使用 three.js 在地形上添加 3D 模型)。three.js 示例对于之后需要在自己控制的应用程序中使用地标、设备或建筑模型的团队来说非常有用。Kaleidr Studio 的当前公共页面专门记录了地形、山体阴影和拉伸建筑物,而不是通用的 GLTF、OBJ、3D Tiles 或网格导入工作流程。在规划自定义资源之前,请确认支持的 Studio 或 Enterprise 版本。
摄像机、标签和业务图层应该如何协同工作?
三维地图的呈现效果不仅取决于几何形状,还取决于俯仰角、方位角、缩放比例和中心点。低俯仰角接近二维效果,有利于概览、标签和熟悉的交互方式。中等俯仰角可以在不丢失方向感的情况下显示地形或建筑物体量。高俯仰角可以营造强烈的深度感,但同时也会增加遮挡、变形和交互难度。应使用能够传达所需深度的最低俯仰角。宣传地图可以打开时使用预设的视角;产品地图则应允许用户通过重置北向、重置俯仰角、缩放和返回选定位置来恢复方向感。
当凸起物和地形占据同一视图时,标签的呈现难度会增加,因为重叠、对比度降低、方向混乱和深度模糊等问题都会加剧。应保持层级结构的简洁:首先显示选定的目的地、重要的商业场所、主要地理参考点,然后是次要信息,而不是显示所有可能的标签。最重要的图层通常是商业信息——房产、商店、资产、活动地点、服务区域、实时事件——而不是地形。地形和建筑物是背景信息;商业信息图层才是主要信息。选中状态是视觉上最突出的元素。
密集的 3D 建筑可能会遮挡标记、路线、标签和多边形,尤其是在倾斜角度较大的情况下。因此,应降低挤出不透明度,简化建筑样式,降低倾斜角度,保持叠加层的可读性,并在核心任务运行时提供 2D 切换选项。品牌颜色在 3D 中仍然很重要,但即使几何体在技术上是三维的,单色处理也能使层级结构变得扁平化。地形需要视觉深度;建筑需要与业务叠加层区分开来;选中状态的强调效果必须突出。
W3C Web 内容无障碍指南 (WCAG) 2.2,一项发布于 2024 年 12 月 12 日的建议,包含成功标准 **1.3.3 感官特征 **:理解和操作内容的说明不应仅仅依赖于形状、颜色、大小、视觉位置、方向或声音等感官特征。因此,高度作为库存、颜色作为状态或音调作为重要性等信息需要文本、列表、图例或工具提示等等效信息。成功标准 **2.3.3 交互动画 **(AAA 级)指出,除非动画必不可少,否则可以禁用由交互触发的动态动画。限制性的镜头过渡可以帮助用户从概览视图移动到选定的属性;频繁的飞行视角可能会导致方向感丧失和运动不适。核心任务应以列表、键盘可访问的控件、清晰的标签和非视觉描述的形式呈现。
团队应如何在 Kaleidr Studio 中创建 3D 地图?
首先设计 2D 层级结构。如果道路难以辨认、业务数据不清晰、标签优先级不高,或者在地图为平面时所选状态效果不佳,那么深度信息只会加剧问题,而不会解决问题。选择地理范围,建立底图,然后添加高程或山体阴影,如果建筑物有帮助,再添加建筑物,然后添加业务叠加层,再添加相机,最后测试标签、选择、性能和发布行为。地图发布 仍然区分草稿和最终使用版本。在高性能桌面电脑上进行的 Studio 预览并非生产环境测试。
物业地图是 3D 地图最强大的应用之一:它不仅包含物业列表,还包含周围的建筑体量、地形、附近设施和道路环境。旅游地图可以利用地形来表示山区、海岸线、观景点和风景路线,就像人工智能驱动的旅游地图一样,同时又不影响地名或可访问的控件。基础设施地图可以将地形与资产、服务区域、事故和检查状态相结合,同时将资产状态作为首要信息。Studio 目前在同一页面上同时列出实时图层和 3D 可视化。这种组合有助于进行地形敏感型跟踪,但会增加渲染成本。仅当深度信息有助于解读实时状态时才使用深度信息;不要仅仅因为深度信息和 3D 可视化功能可用就对复杂场景中成千上万个移动的资产进行动画渲染。
性能提升可能会增加 GPU 工作负载、内存占用、图块需求、场景复杂性和电池消耗,因此团队应测试旧款手机、集成笔记本电脑 GPU、移动浏览器和大尺寸显示器。在相关情况下,应测量启动速度、帧速率、交互响应速度、内存占用和设备发热情况。渐进增强是一种产品选择:性能强大的设备可以显示地形和建筑物;性能有限的设备可以显示山体阴影或 2D 图像,但核心功能无论哪种方式都应保持可用。在移动设备上,过高的倾斜角度会减少可视区域,手指可能会遮挡场景,弹出窗口会与建筑物争夺用户注意力,旋转图像可能会使用户感到迷失方向,因此应降低默认倾斜角度,增强重置效果,放大选定的标记,并保持北方方向清晰可见。
当地图可以独立显示或需要快速查看时,分享链接非常有用。当周围内容解释上下文或业务操作位于地图之外时,嵌入地图非常有用;请参阅如何嵌入交互式地图。3D 场景应与宿主页面相协调,而不是喧宾夺主。营销地图可能会强调第一印象。产品地图应强调方向性、交互性、清晰易读的标签、稳定的控件和性能。同一张 Studio 地图可能需要根据不同的受众群体设置不同的默认值。

3D 地图产品应避免哪些故障模式?
常见的故障是,用户仅仅因为 3D 效果看起来很棒就启用它,而不是因为垂直形态会影响决策。高倾斜度会导致标签被遮挡,建筑物会掩盖业务数据,每个数值多边形都会变成一列。渲染高度被视为绝对真实值,用户会假定使用任意 3D 模型而没有提供 Studio 文档路径,并且所有设备都被强制置于同一场景中。摄像机始终处于动态状态,这意味着用户只能在透视中体验,而 2D 层级结构也从未经过设计。
| 错误 | 结果 | 更佳方案 |
| --- | --- | --- |
| 添加 3D 效果,因为它看起来很棒 | 产品变成装饰品 | 将深度与用户决策关联 |
| 到处使用高间距 | 标签和标记消失 | 使用中等间距 |
| 将渲染高度视为精确值 | 视觉效果精度被高估 | 记录数据源 |
| 拉伸每个数值多边形 | 场景变得难以阅读 | 仅在有意义时使用高度 |
| 让建筑物掩盖业务数据 | 核心任务被隐藏 | 保持叠加层在视觉上占主导地位 |
| 在所有设备上使用 3D | 性能下降 | 渐进增强 |
| 添加不支持的任意 3D 模型 | 集成假设被打破 | 确认当前产品功能|
| 持续动画化相机 | 用户失去方向感 | 使用克制的过渡效果 |
| 仅依赖透视 | 可访问性降低 | 添加文本和标签 |
| 跳过 2D 设计 | 3D 加剧了糟糕的层级结构 | 优先采用平面设计 |
空间人工智能可以帮助用户询问哪些房产位于地势较高处、哪些设施最靠近山脊,或者哪些建筑物环绕着某个场所。应用程序应将这些意图转化为针对权威高程和建筑数据的结构化空间查询,然后解释并移动地图。不要通过查看渲染图像来推断确切的高程。语言模型负责编写和解释;地理空间服务和业务数据集才是事实。
在 Kaleidr Studio 中构建 3D 地图
在 Kaleidr Studio 中,生产级 3D 地图的制作始于用户必须做出的决策,然后设计 2D 层级结构,最后仅添加能够优化该决策的深度。业务数据始终保持视觉主导地位,相机位置可恢复,并且在发布或嵌入之前会进行性能和可访问性测试。探索 Kaleidr Studio 以了解当前地形、海拔、山体阴影、拉伸建筑物、底图和发布表面。在编码公共页面上未记录的自定义 3D 模型路径之前,请确认 Studio 合同。
常见问题解答
什么是 3D 地图?
3D 地图使用地形海拔、透视、拉伸建筑物或其他三维几何体来表示垂直空间信息。
什么情况下 3D 地图比 2D 地图更好?
当高程、坡度、建筑体量或垂直关系能够显著提升用户理解时,3D 地图更胜一筹。对于简单的位置搜索或复杂的操作界面,2D 地图可能更清晰。
Kaleidr Studio 目前描述了哪些 3D 功能?
Kaleidr Studio 目前记录了 3D 地形、真实高程、山体阴影和拉伸建筑物。
Kaleidr Studio 是否支持真实高程数据?
当前 Studio 页面显示,地形、山体阴影和拉伸建筑物均基于真实高程数据构建。
山体阴影与 3D 地形相同吗?
不同。山体阴影通过视觉方式模拟高程起伏,而 3D 地形则改变渲染后的表面几何形状。
如何在 Web 地图上创建 3D 建筑物?
一种常见的实现方式是使用高度和基准高度属性拉伸建筑物轮廓。例如,MapLibre GL JS 支持通过样式图层拉伸建筑物。
是否支持上传任意 3D 模型?
当前 Studio 的公开页面介绍了地形、山体阴影和拉伸的建筑物,但并未描述通用的任意 3D 模型导入工作流程。在规划自定义模型之前,请确认支持的集成方式。
3D 地图会影响性能吗?
会。地形、建筑物几何形状、3D 模型、高俯仰角和大型数据集都会增加 GPU、内存、网络和电池的使用。
3D 地图是否应该使用高相机俯仰角?
不一定。使用能够传达所需深度的最低音调,同时保持标签、方向和交互性。
空间人工智能能否处理 3D 地图?
理论上可以。语言模型可以解释涉及地形或建筑环境的问题,但底层的高程、几何形状和空间计算应来自结构化的地理数据。
我能否发布使用 Kaleidr Studio 制作的 3D 地图?
Kaleidr Studio 目前支持发布和嵌入地图体验。在正式发布前,请在各种设备上测试 3D 场景。
参考文献
- Kaleidr. AI Map Maker for Branded Interactive Maps. Accessed 30 August 2026. https://kaleidr.com/studio
- Mapbox. 3D buildings in a Mapbox Style. Accessed 30 August 2026. https://docs.mapbox.com/help/dive-deeper/z_add-3d-buildings-studio/
- MapLibre GL JS. 3D Terrain. Accessed 30 August 2026. https://maplibre.org/maplibre-gl-js/docs/examples/3d-terrain/
- MapLibre GL JS. Adding 3D models using three.js on terrain. Accessed 30 August 2026. https://maplibre.org/maplibre-gl-js/docs/examples/adding-3d-models-using-threejs-on-terrain/
- MapLibre GL JS. Display buildings in 3D. Accessed 30 August 2026. https://maplibre.org/maplibre-gl-js/docs/examples/display-buildings-in-3d/
- MapLibre Style Spec. Terrain. Accessed 30 August 2026. https://maplibre.org/maplibre-style-spec/terrain/
- W3C. Web Content Accessibility Guidelines (WCAG) 2.2. W3C Recommendation, 12 December 2024. Accessed 30 August 2026. https://www.w3.org/TR/WCAG22/
@misc{kaleidr_studio_3d_2026_08_30,
title = {AI Map Maker for Branded Interactive Maps},
author = {{Kaleidr}},
note = {Accessed 30 August 2026},
url = {https://kaleidr.com/studio}
}
@misc{mapbox_3d_buildings_style_2026_08_30,
title = {3D buildings in a Mapbox Style},
author = {{Mapbox}},
note = {Accessed 30 August 2026},
url = {https://docs.mapbox.com/help/dive-deeper/z_add-3d-buildings-studio/}
}
@misc{maplibre_3d_terrain_2026_08_30,
title = {3D Terrain},
author = {{MapLibre GL JS}},
note = {Accessed 30 August 2026},
url = {https://maplibre.org/maplibre-gl-js/docs/examples/3d-terrain/}
}
@misc{maplibre_threejs_terrain_2026_08_30,
title = {Adding 3D models using three.js on terrain},
author = {{MapLibre GL JS}},
note = {Accessed 30 August 2026},
url = {https://maplibre.org/maplibre-gl-js/docs/examples/adding-3d-models-using-threejs-on-terrain/}
}
@misc{maplibre_display_buildings_3d_2026_08_30,
title = {Display buildings in 3D},
author = {{MapLibre GL JS}},
note = {Accessed 30 August 2026},
url = {https://maplibre.org/maplibre-gl-js/docs/examples/display-buildings-in-3d/}
}
@misc{maplibre_style_spec_terrain_2026_08_30,
title = {Terrain},
author = {{MapLibre Style Spec}},
note = {Accessed 30 August 2026},
url = {https://maplibre.org/maplibre-style-spec/terrain/}
}
@techreport{w3c_wcag22_2024,
title = {Web Content Accessibility Guidelines (WCAG) 2.2},
author = {{W3C}},
institution = {W3C},
year = {2024},
month = dec,
note = {W3C Recommendation, 12 December 2024; accessed 30 August 2026},
url = {https://www.w3.org/TR/WCAG22/}
}