Introduction
@icraft/player-react is a newly launched React component library by iCraft Editor, specifically designed to simplify frontend integration of 3D digital twin scenarios. Through this component, developers can easily embed 3D scenes created in iCraft Editor into their React projects, gaining rich interactive capabilities and real-time data integration features.
Features
- 🚀 Ready to Use - Zero configuration integration, just a few lines of code to get started
- 🎨 Custom Plugin Sets - Support for optional features through a flexible plugin mechanism
- 🔌 Practical Events and Methods - Provides rich events and methods for easy integration with your project
- 🎬 Animation Control - Support for autoplay, loop playback, and other animation controls
- 🔌 Real-time Data Integration - Support for real-time data integration to achieve digital twins
Installation
pnpm install @icraft/player-react --save
Usage
Just a few lines of code to integrate 3D scenes into your React project:
import { ICraftPlayer } from "@icraft/player-react";
export default function MyScene() {
return <ICraftPlayer src='your-scene.iplayer' />;
}
Important Note: The
.iplayerfile needs to be exported from iCraft Editor. This is an optimized 3D scene file format that contains complete scene information. You can obtain this file through the "Export" function after editing your scene in iCraft Editor.
Examples
Service Status Monitoring
Demonstrates how to visualize real-time server cluster operational status data in 3D scenes, including key metrics like CPU usage, memory consumption, uptime, and more.
Global E-commerce Real-time Data
Shows how to map real-time transaction data, user traffic, order status, and other information from an e-commerce platform into 3D scenes for business data visualization monitoring.
Refinery Real-time Production Data
Demonstrates how to display real-time equipment operational status and production data from industrial environments in 3D scenes to achieve industrial digital twins.
Summary
@icraft/player-react provides developers with a one-stop 3D digital twin visualization solution. Through simple configuration, you can quickly build professional 3D visualization applications. Combined with flexible APIs and real-time data integration capabilities, it enables rapid implementation of your digital twin projects. Whether for monitoring dashboards, operational analysis, or industrial internet applications, @icraft/player-react can help you achieve your goals effortlessly.
Whether you need to create system architecture diagrams, software architecture diagrams, cloud architecture diagrams, IT infrastructure diagrams, deployment architecture diagrams, or 3D structural diagrams, network architecture diagrams, and network topology diagrams, iCraft Editor can be used to draw them all and implement digital twins.
Start using @icraft/player-react now and explore the unlimited possibilities of digital twins!
Top comments (0)