meta2d.js

repository·main·Indexed 22 days ago

https://github.com/le5le-com/meta2d.js

A real-time data exchange and interactive web 2D engine for building Web SCADA, IoT, and Digital Twin applications. It features data-driven views, real-time monitoring, and a suite of packages including @meta2d/vue for declarative UI, @meta2d/chart-diagram for ECharts/Highcharts integration, @meta2d/transform for pseudo-3D effects, and specialized tools for activity diagrams and SVG parsing.

Tokens
41K
Snippets
41
Records
289
Agent score
78%

What's inside meta2d.js

  1. Overview of @meta2d/transform

    main

    The @meta2d/transform library is a 2D element transformation library designed to implement dynamic 2D-to-pseudo-3D effects. Instead of transforming individual elements into 3D objects, it simulates a change in perspective (viewpoint), which helps create more realistic scenes for 2.5D projects.

    Warning: This library is currently unstable. Configurations may change before the 1.0 release, and it has not undergone full testing. Use it at your own risk.

  2. Overview of Meta2d.js

    main

    Meta2d.js is a 2D engine designed for real-time data response and interaction. It is optimized for Web configuration (low-code/no-code), Internet of Things (IoT), and Digital Twin scenarios. The engine is data-driven, meaning the display is controlled by data, supporting multi-state presentations, progress indicators, and complex animations.

    Key capabilities include:

    • High Performance: Supports 10,000+ nodes (up to 20,000 with native engine nodes) and 1,000+ simultaneous animations.
    • Real-time Data Integration: Supports dynamic data listening via MQTT, WebSocket, or custom HTTP requests.
    • Extensibility: Supports middleware for automatic algorithms (e.g., layout, auto-anchoring) and custom business logic.
    • Rich Interaction: Provides lifecycle events for brushes (create, update, destroy), mouse events (enter, leave, click, select), transformation events (move, zoom, rotate), and more.
  3. Overview of Meta2d.js

    main
    Meta2d.js is a real-time data exchange and interactive web 2D engine designed for building high-performance visual applications such as Web SCADA, IoT dashboards, and Digital Twins. It focuses on data-driven views, real-time monitoring, and rich interactivity.
  4. Key features of Meta2d.js

    main

    Meta2d.js provides several core capabilities for interactive 2D web applications:

    • Data-driven view: Synchronize visual elements with underlying data models.
    • Real-time data monitoring: Handle live data streams for IoT and SCADA use cases.
    • Rich interactive events: Support complex user interactions.
    • Subscribe message: Implement pub/sub patterns for data updates.
    • Animation & Video: Support for visual transitions and video playback.
    • Lifecycle hooks: Access and control the lifecycle of components.
    • Extensibility: Easily extend the engine with custom logic or components.
  5. Get started with Meta2d.js Vue 3 Diagram Editor

    main

    To begin using Meta2d.js in a Vue 3 environment, you can refer to the official diagram editor example provided in the repository. This example demonstrates how to integrate the engine into a Vue 3 application for building diagram editors.

    View the example here: https://github.com/le5le-com/meta2d.js/tree/main/examples/diagram-editor-vue3