【国产开源可视化引擎】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、博文支持

相关推荐
天天扭码6 分钟前
总所周知,JavaScript中有很多函数定义方式,如何“因地制宜”?(ˉ﹃ˉ)
前端·javascript·面试
一个专注写代码的程序媛11 分钟前
为什么vue的key值,不用index?
前端·javascript·vue.js
장숙혜22 分钟前
ElementUi的Dropdown下拉菜单的详细介绍及使用
前端·javascript·vue.js
火柴盒zhang25 分钟前
websheet之 编辑器
开发语言·前端·javascript·编辑器·spreadsheet·websheet
某公司摸鱼前端27 分钟前
uniapp 仿企微左边公司切换页
前端·uni-app·企业微信
Geek__199230 分钟前
VSCode远程图形化GDB
ide·vscode·编辑器
WKK_30 分钟前
uniapp自定义封装tabbar
前端·javascript·小程序·uni-app
莫问alicia31 分钟前
react 常用钩子 hooks 总结
前端·javascript·react.js
Mintopia40 分钟前
图形学中的数学基础与 JavaScript 实践
前端·javascript·计算机图形学
Mintopia1 小时前
Three.js 制作飘摇的草:从基础到进阶的全流程教学
前端·javascript·three.js