数字孪生-DTS-孪创城市-湖区分布

前言

各位小伙伴们,大家好,今天蘑菇头带来的是世界湖区功能的一个分享,主要利用的是图片贴花的技术,将我们的图片与三维场景进行一个贴合的效果,可以较为宏观的对我们的场景进行一个分析,快来一起看看吧。

思路

首先可以看到,同样需要将我们的样式进行调整,所以直接复用我们上一段代码。

dart 复制代码
 await fdapi.camera.set(525323.14875, 3435349.377813, 273227.06, -85.987404, -95.227394, 2)
 await fdapi.weather.setDarkMode(true)
 await fdapi.infoTree.hide(digitalTwinStore.digitalTwin['苏州地形影像_Water'])

通过api文档可以发现,图片贴花比较简单,只需要调用Decal类的add方法,通过调节位置,缩放,旋转参数就能达到我们想要的效果。

但是,可以通过代码调节起来会很麻烦,所以我们直接写了一个组件来帮助大家调节。贴花组件_免费高速下载|百度网盘-分享无限制

需要将lib下的两个配置文件(ac.min/ac.conf)进行替换为cloud里面sdk下的配置文件,打开是这个样子。

首先,我们先点击获取位置,然后在合适的位置点击鼠标左键即可看见坐标上去了,然后填写贴花路径,这个路径是我们cloud资源路径对应下的贴花路径,直接点击复制粘贴过去即可,然后就可以看见贴花上去了。

但是可能会被拉升导致变形,没关系,我们可以通过调节位置,缩放等操作就可以调整到我们想要的位置,然后点击获取贴花参数,复制到我们的代码中即可快速完成调节。

所以我们完整的代码是这样。

dart 复制代码
import { useDigitalTwinStore } from '@/stores/digitalTwin'
const digitalTwinStore = useDigitalTwinStore()

export const initLake = async () => {
  await fdapi.camera.set(525323.14875, 3435349.377813, 273227.06, -85.987404, -95.227394, 2)
  await fdapi.weather.setDarkMode(true)
  await fdapi.infoTree.hide(digitalTwinStore.digitalTwin['苏州地形影像_Water'])

  const decal = {
    id: 'lake',
    groupId: '',
    userData: '',
    texturePath: '@path:世界湖区.png',
    order: 1,
    decalBlendMode: 0,
    location: [524000, 3462000, 127],
    rotation: [-90, 0, 0],
    scale: [270000, 270000, 270000]
  }
  await fdapi.decal.add(decal)
}
export const exitLake = async () => {
  await fdapi.weather.setDarkMode(false)
  await fdapi.infoTree.show(digitalTwinStore.digitalTwin['苏州地形影像_Water'])
  await fdapi.decal.delete('lake')
}

涉及的飞渡api

  • 添加贴花-fdapi.decal.add('lake')

  • 删除贴花-fdapi.decal.delete('lake')

相关推荐
晓说前端1 分钟前
TypeScript 核心语法应用 —— Vue 3 中的使用(下)
前端·javascript·typescript·类型系统
zhangminghuan10 分钟前
微信小程序开发核心知识点全景解析(前端必备硬核基础)
前端·微信小程序·小程序
boooooooom24 分钟前
尝尝咸淡:从朴素 RAG 到 Graph RAG——一个烹饪问答系统的三层检索升级之路
前端·后端·llm
cindershade34 分钟前
让每条前端异常都能回答:该由谁修、为什么现在修
前端
bitbrowser1 小时前
Telegram提示尝试次数过多,换网络和重装有用吗
前端
研☆香1 小时前
前端简单的的变量声明
前端
赵大仁1 小时前
Next.js AI Route Handler 工程化:超时、流式与鉴权
前端·ai·鉴权·next.js·工程化
yuhaiqiang2 小时前
从这两件事就能看出 vibecoding 距离专业作品差距有多大?AI 能抹平技术,但抹不平品味 !
前端·后端·程序员
一次旅行2 小时前
DeepSeek‑V4‑Flash‑Vision‑Exp 小白入门实战|3种传图方式、完整可跑代码、避坑排障
java·前端·人工智能
其实防守也摸鱼2 小时前
Codex破局:前端组件秒级生成的技术文章大纲
开发语言·前端·人工智能·学习·安全·web安全