【国产开源可视化引擎】Meta2d.js简介

Meta2d.js:2D图元组成的可视化引擎

乐吾乐科技自主研发,集实时数据展示、动态交互、数据管理等一体的全功能2D可视化引擎。能够快速实现数字孪生、大屏可视化、Web组态、SCADA等解决方案。具有实时监控、多样、变化、动态交互、高效、可扩展、支持自动算法、跨平台等特点,最大程度减少研发和运维的成本,并致力于普通业务人员 0 代码开发实现物联网、工业互联网、电力能源、水利工程、智慧农业、智慧医疗、智慧城市等可视化解决方案。

核心要素

  • 图纸:一个可视化项目
  • 画布:绘画或展现区域
  • 图元:又称画笔Pen,主要由节点、连线2类
  • **数据:**分图纸数据和图元数据两种
  • 算法:绘画过程中用到的辅助算法或排版布局算法等
  • 状态:默认、活动、选中;自定义属性状态
  • 事件:交互事件
  • 动画:图元帧动画、连线轨迹动画
  • 坐标
    有 3 种:画笔坐标、相对坐标、世界坐标。
    • 画笔坐标:
      通过 meta2d.getPenRect(pen)获取。不移动画笔,坐标不变。
    • 相对坐标:
      相对父元素或画布的坐标,也是 Pen 数据保存的坐标。相对父元素时,坐标不变;相对画布时(没有父元素),缩放时会因为画布大小变化而变化。
    • 世界坐标:
      底层 canvas 的绘画坐标。

能力

组态能力

  • 拖拽编辑,简单易用
  • 数据绑定,实时动态数据显示,数据下发,双向数据通信,条件、格式化显示
  • 逐帧动画和轨迹动画,条件告警动画等
  • 事件、消息,组态联动
  • 组合、自定义状态、开关、、报表、弹框、视频等
  • 丰富外观、格式刷功能

数据通信

  • 支持 mqtt 动态数据监听
  • 支持 websocket 动态数据监听
  • 支持 http 自主请求动态更新数据

多端适配

  • 支持Chrome、Firefox、Edge等主流浏览器。
  • 支持移动端webview方式访问

扩展

  • 图形库扩展:自定义图形库扩展,格式支持js、svg、jpg、iconfront
  • 数据显示扩展:条件显示、数据格式显示、自定义函数扩展等
  • 交互事件扩展:系统消息、自定义消息、生命周期hook、系统接口函数等
  • 智能算法扩展:支持自定义拖拽智能算法,自定义连线算法等
  • 动画扩展:节点逐帧定义动画、自定义算法动画
  • 排版扩展:支持自定义排版布局算法

导出集成

  • 导入导出组态图
  • 导出HTML、Vue、React等离线部署包
  • 支持组态图环境迁移能力
  • 支持通过API对组态进行创建、查询、删除、复制、发布等管理能力
  • 支持组态设计页面内嵌集成到第三方平台
  • 支持组态查看页面内嵌集成到第三方平台
  • 提供离线部署安装方式,支持云端部署

性能

  • 稳定,系统交互中断不影响系统运行
  • 可支持10000-20000节点
  • 支持绑定1000-2000数据点。1000数据点30ms完成刷新
  • 支持 1000+动画播放

国产开源

乐吾乐潜心研发,自主可控,持续迭代优化

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

Gitee: meta2d.js: The meta2d.js is real-time data exchange and interactive web 2D engine. Developers are able to build Web SCADA, IoT, Digital twins and so on. Meta2d.js是一个实时数据响应和交互的2d引擎,可用于Web组态,物联网,数字孪生等场景。

欢迎Star、Fork、博文支持

相关推荐
Z兽兽3 分钟前
React 18 开发环境下useEffect 会执行两次,原因分析及解决方案
前端·react.js·前端框架
紫_龙5 分钟前
最新版vue3+TypeScript开发入门到实战教程之Vue3详解props
前端·vue.js·typescript
树上有只程序猿11 分钟前
这波低代码热,能维持多久
前端
姓王名礼16 分钟前
这是一个完整的全栈交付包,包含Vue3 前端交互界面(集成数字人视频流、ECharts 图表、语音对话)和Docker Compose 一键部署脚本。
前端·docker·echarts
嵌入式-老费20 分钟前
vivado hls的应用(axis接口)
前端·webpack·node.js
孟陬27 分钟前
国外技术周刊第 2 期 — 本周热门 🔥 YouTube 视频 TED 演讲 AI 如何能够拯救(而非摧毁)教育
前端·后端·程序员
ayingmeizi16329 分钟前
从算力领先到增长领先:前沿科技企业为何需要AI原生CRM作为增长引擎
人工智能·科技·数据可视化·crm·ai-native
小飞大王66642 分钟前
从零手写 React:深度解析 Fiber 架构与 Hooks 实现
前端·react.js·架构
不甜情歌1 小时前
JS 异步:Event-Loop+async/await
前端
程序员库里1 小时前
AI协同写作应用-TipTap基础功能
前端·javascript·面试