产品文档

京东莫奈可视化平台

2023-12-08 09:28:10

三维城市

组件说明

三维城市组件可实现对街市街景的真实建模、特效添加、镜头移动路径设置等效果。

组件对接了51world云渲染平台的相关服务支持。该组件主要以三维形式展现城市建筑群及相应地理信息数据,支持通过渲染口令的方式修改三维模型,可在三维城市基础上叠加散点、场景特效等地理信息子组件。

效果案例

3dcity1.png

组件结构

三维城市组件主要由「父组件」及「子组件」两部分组成,可根据实际场景分别定义对应配置项。每个组件都对应样式、数据、交互三部分。

111.jpg

11304.png

父组件配置

子组件管理

组件创建时,系统会默认携带常用子组件,使用者可根据实际场景对子组件进行新增或编辑。

112.jpg

样式

①基本属性

位置尺寸:

图表位置包括组件的横坐标纵坐标,单位为px;横坐标为组件左上角距离页面左边界的像素距离,纵坐标为组件左上角距离页面上边界的像素距离。

图表尺寸包括组件的宽度高度,单位为px;可单击比例锁锁定组件宽高比,等比例调整组件的宽高,比例锁默认不锁定。

旋转角度包括组件的宣传角度,单位为deg

11306.png

②服务设置

服务设置中三维可切换城市底板地图服务,可自定义三维城市地图。将复制的渲染口令粘贴至服务设置中,即可完成三维城市底图的替换。

11308.png

渲染口令及场景简介一览

场景名称:城市大脑_4.0

场景介绍:“城市大脑_4.0”案例基于51AES技术方案,使用GIS数据自动生成上海全域三维场景。 打造更精细、更完善、更科学、更智慧、更高效的“一张网”,让城市管理像绣花针一样精细。

渲染口令:e3DF5C11

e3DF5C11.jpg

场景名称:园区_4.0

场景介绍:“园区_4.0”案例基于51AES技术方案,使用GIS数据还原接近真实世界的三维场景.在此基础上完整还原园区内部建筑,实现数字孪生智慧园区。

渲染口令:C52E828b

C52E828b.jpg

场景名称:景区_4.0

场景介绍:“景区_4.0”案例基于51AES技术方案,使用GIS数据还原接近真实世界的三维场景,在此基础上完整还原景区建筑,实现数字孪生智慧景区。

渲染口令:12E0299D

12E0299D.jpg

场景名称:广州_4.0

场景介绍:“广州_4.0”案例基于51AES技术方案,使用GIS数据自动生成接近真实世界的三维场景。

渲染口令:DF96469D

DF96469D.jpg

场景名称:新区_4.0

场景介绍:“新区_4.0”案例基于51AES技术方案,自动生成郑州三维场景,实现智慧新区可视化管理。

渲染口令:eB7Ed0b0

eB7Ed0b0.jpg

场景名称:楼宇_4.0

场景介绍:“楼宇_4.0”使用CAD图纸完整还原了楼体内部结构,用来展示建筑物内部和外部世界的联系。

渲染口令:f1d50eC4

f1d50eC4.jpg

③坐标设置

选择坐标类型为经纬度坐标或CAD坐标。

④镜头设置

控制预览是镜头的运动路径。可以通过配置项调整镜头。

11309.png

{
    "coord_type": "0",
    "cad_mapkey": "", 
    "center_coord": "113.321874,23.102038",
    "arm_distance": "1151.056519", 
    "arm_distance_max": "2500.0", 
    "arm_distance_min": "50.0", 
    "pitch": "24.75", 
    "pitch_max": "89.0", 
    "pitch_min": "8.0", 
    "yaw": "149.25", 
    "fly": false
}

⑤水晶体设置

默认关闭,开启后可选择水晶体的样式、热区的效果。

⑥测量工具

默认关闭,开启后可显示测量工具。可以测量三维世界中的坐标、距离、面积;

⑦天气设置

默认关闭,开始后可显示天气状态,可设置晴天、阴天、中雨、中雪、雾霾等天气情况。

⑧光照设置

默认关闭,开启后可选择需要显示的光照时间点,可设置8点、12点、16点、20点来实现光照效果。

⑨音效设置

默认关闭,开始后可播放三维场景音效。

数据

三维城市主组件数据一般场景下无需进行编辑操作。

交互

可以设置三维城市的局部事件和数据事件

113011.png

子组件管理

散点层

散点层是在城市模型基础上,添加不同样式点的图层;除此之外,散点层还可以支持跳转界面的操作。

样式

113012.png

数据

支持在“数据”中调整子组件连接的数据,支持与动态数据的链接,动态数据需支持莫奈中的静态数据、API、数据库。

113013.png

数据样例
[
    {"coord":"113.317818,23.102919",
    "coord_z":0,
    "markerInfo":{"markerWidth":100,"markerHeight":228,"normalUrl":"http://superapi.51hitech.com/doc-static/images/static/markerNormal2.png","activateUrl":"http://superapi.51hitech.com/doc-static/images/static/markerActive2.png"},
    "labelInfo":{"labelWidth":200,"labelHeight":80,"bgImageUrl":"http://superapi.51hitech.com/doc-static/images/static/LabelBg.png","labelOffset":"50,200","labelContent":"文本内容","labelSize":30,"labelColor":"#ECC500"},
    "setPopup":{"popupUrl":"https://imonet.jd.com/#/screen?key=d359d5778095469ea88f58fe109344b1","popupWidth":800,"popupHeight":380,"popupOffset":"50,180"}
    }
]
交互

支持子组件与莫奈中的其他组件进行交互。

场景特效

场景特效是指基于城市建模底图中,向三维城市中加入一些特殊动效的图层。

样式

场景特效样式设置可设置特效名称、坐标等基本信息;还可选择不同的场景特效样式以及加上跳转链接实现交互动作。

预设了地标建筑、设备维护、发生事故的19种常见场景。

113015.png

数据

113016.png

数据样例

[
    {
    "type":"shield",
    "scale":50,
    "coord":"113.320969,23.104143",
    "coord_z":0,
    "pitch":0,
    "titleStyle":{"titleTextPortrait":false,"titleContent":"防护预警","titleSize":50,"titleColor":"rgba(173,67,139,0.85)"},
    "setPopup":{"popupUrl":"https://imonet.jd.com/#/screen?key=d359d5778095469ea88f58fe109344b1","popupWidth":800,"popupHeight":380,"popupOffset":"0,0"}
    }
]
交互

支持子组件与莫奈中的其他组件进行交互。

文档反馈

开始与售前顾问沟通

可直接拨打电话 400-098-8505转1

我们的产品专家为您找到最合适的产品/解决⽅案

在线咨询 5*8⼩时

1v1线上咨询获取售前专业咨询

点击咨询
企微服务助手

专业产品顾问,随时随地沟通