@icraft/player-react 是 iCraft Editor 全新推出的 React 组件库,专为简化 3D 数字孪生场景的前端集成而设计。通过该组件,开发者可以轻松地将 iCraft Editor 制作的 3D 场景无缝嵌入到 React 项目中,并获得丰富的交互能力和实时数据集成特性。
pnpm install @icraft/player-react --save
只需几行代码,即可在您的 React 项目中集成 3D 场景:
import { ICraftPlayer } from "@icraft/player-react";
export default function MyScene() {
return <ICraftPlayer src='your-scene.iplayer' />;
}
重要提示: .iplayer
文件需要从 iCraft Editor 中导出,这是一个经过优化的 3D 场景文件格式,包含了场景的完整信息。您可以在 iCraft Editor 中编辑场景后,通过"导出"功能获取该文件。
展示如何将服务器集群的运行状态数据实时展示在 3D 场景中,包括 CPU 使用率、内存占用、运行时间等关键指标的可视化展示。
展示如何将电商平台的实时交易数据、用户访问量、订单状态等信息映射到 3D 场景中,实现业务数据的可视化监控。
展示如何将工业生产环境中的设备运行状态、生产数据等实时展示在 3D 场景中,实现工业数字孪生。
@icraft/player-react 为开发者提供了一站式的 3D 数字孪生可视化解决方案。通过简单的配置即可快速构建专业的 3D 可视化应用,配合灵活的 API 和实时数据接入能力,让您的数字孪生项目快速落地。无论是监控大屏、运营分析,还是工业互联网应用,@icraft/player-react 都能助您轻松实现。
无论是系统架构图、软件架构图、云架构图、IT 架构图、部署架构图,还是 3D 结构图、网络架构图、网络拓扑图,都可以使用 iCraft Editor 来绘制并实现数字孪生。
立即开始使用 @icraft/player-react ,探索数字孪生的无限可能!
1
zcc520510 27 天前
真棒啊,之前就在找这个,3d 拓扑
|
2
kelvinji2009 27 天前
如果有两层楼呢?怎么展示?
|
3
favori OP @zcc520510 感谢关注,使用过程中有任何问题可以在这个频道进行交流 https://discord.com/invite/3M9xuaB2FR
|
4
favori OP @kelvinji2009 对于空间上的位置高度也是支持调整的,可以通过元素属性面板进行位置高度调整,从而实现多层楼的效果,另外元素也有高度吸附功能,可以很方便的从一个物体拖到另一个物体之上
|
5
kelvinji2009 21 天前
@favori 有点做不出效果,可以帮忙做个 demo 么?
|
6
favori OP @kelvinji2009 可以,加群我发你 demo 哈 https://discord.gg/4erRDrN4
|