19个Web前端交互式3D JavaScript框架和库

JavaScript (JS) 是一种轻量级的解释(或即时编译)编程语言,是世界上最流行的编程语言。JavaScript 是一种基于原型的多范式、单线程的动态语言,支持面向对象、命令式和声明式(例如函数式编程)风格。JavaScript 几乎可以做任何事情,更可以在包括物联网在内的多个平台和设备上运行。

在WebGL库和SVG/Canvas元素的支持下,JavaScript变得惊人的强大。几乎可以为网络构建任何东西,包括基于浏览器的游戏和本地应用,许多最新的突破性功能都在3D上运行。

为此,「数维图小编」整理了19个交互式3D Javascript库和框架,用于在Web上创建3D图形,希望你的下一个项目用的上它们:

# - Three.js

Three.js 是一个高级跨浏览器的3D JavaScript库和应用程序编程接口,用于使用WebGL在Web浏览器中创建和显示动画3D计算机图形。是最受欢迎的 3D WebGL 库之一,为无数 3D 体验提供支持。也是最好的 3D 库之一。ThreeJS主要处理画布元素,SVG元素和用于渲染的WebGL库。

# - D3.js

D3.js 是一个免费的开源 JavaScript 库,,用于在 Web 上创建图表、地图等可视化效果。D3.js(也称为 D3,数据驱动文档的缩写)是一个 JavaScript 库,用于在 Web 浏览器中生成动态、交互式数据可视化。它使用可缩放矢量图形 (SVG)、HTML5 和级联样式表 (CSS) 标准。

# - A frame

A Frame 是一种流行的开源 Web 框架,用于在 Web 浏览器中构建虚拟现实体验。这个javascript框架为开发人员提供了开发虚拟现实设计的能力,可以在浏览器上渲染。

# - Babylon.js

Babylon.js 是一个基于 Web 的 3D 图形引擎,支持 WebGL 1.0 / 2.0 / WebGPU、场景图、物理、拾取、碰撞、动画、音频等。它建立在Web图形库之上,用于在Web浏览器中渲染图形。

# - Zdog

Zdog 是用于画布和 SVG 的 3D JavaScript 引擎。使用 Zdog,可以在 Web 上设计和渲染简单的 3D 模型。Zdog 是一个伪3D引擎。它的几何图形存在于 3D 空间中,但呈现为平面形状。这使得 Zdog 与众不同。

# - Cannon.js

Cannon.js 是一个基于Web的物理引擎,旨在增强基于Web的游戏开发。它引入了简单的碰撞检测,各种身体形状、接触、摩擦和Web约束。它还具有强大的API,使你能够构建自己的想法。

# - PlayCanvas

PlayCanvas 是一个游戏引擎,它利用 HTML5 和 WebGL 来创建游戏和其他交互式 3D 组件。

# - LightGl.js

LightGl.js 基于WebGL框架,被认为是在浏览器上渲染3D最快最轻的库。LightGl 提供了对代码库的大量控制。

# - Phoria.js

Phoria.js 旨在使用 HTML5 画布元素渲染基于 Web 的运动效果。它不是基于WebGL的,所以你不必担心。

# - Cesium.js

Cesium.js 使用WebGL进行硬件加速图形,它旨在在Web浏览器上创建3D地球仪和2D地图。

# - Scene.js

Scene.js 是一个基于 JavaScript 时间轴的动画库,用于创建动画网站。它允许创建对象移动和位置的时间顺序。

# - Xeogl

Xeogl 是WebGl上的3D模型可视化,它提供了在xeolabs开发的浏览器上创建3D世界的工具。

# - ClayGL

ClayGL 是一个易于使用的,可配置为高质量的图形,并基于WebGL图形库构建可扩展的Web3D应用程序。

# - DivSugar

DivSugar 是一个基于 CSS 的库,用于渲染 3D 场景图、动画系统和几何类。将3D动画集成到现有网页中非常容易。

# - Tilt.js

Tilt.js 是一个微小的请求AnimationFrame驱动的60 + fps轻量级视差倾斜效果,用于jQuery。

# - Turbulenz_engine

Turbulenz 是一个模块化的3D和2D游戏框架,能够在基于HTML5的浏览器上创建游戏。

# - Voxel

Voxel 是一个用于构建基于Web的游戏的JavaScript工具包。它是项目的集合,使开发更容易。

# - SVG 3D Builder

SVG 3D Builder 使用 SVG 创建 3D 模型,并提供简洁的 API。

# - Voodoo.js

Voodoo.js 是一个 Javascript 框架,用于创建与 3D HTML 无缝集成的 2D WebGL 控件。

# - Tips

Sovit3D 是一个可视化开发平台,基于JavaScript语言的3D图形引擎,为Web可视化提供了丰富的展现形式和视觉效果,帮助软件开发公司、解决方案提供商轻松搭建3D可视化界面。平台聚焦工业数字孪生的生产管控、智慧城市的监控运维等可视化应用领域,产品的模块组态化形式可以满足全要素智慧场景的构建。

Sovit3D 平台采用B/S架构,基于WebGL绘图技术标准,提供基于Web浏览器的3D可视化行业组件,支持HTML5/SVG等最新技术,可方便的在浏览器上进行浏览和调试。为开发人员制作符合用户使用习惯的大屏可视化应用,包括2D图表分析、3D建筑实景、3D工业设备模型等相关内容,轻松拖拽即可实现,控制实时数据及动画展示、历史回放、报警、命令下发等功能。

Sovit3D 零代码可视化在线编辑,全自动化场景文件生成;多种数据源接入,轻松与第三方平台无缝数据对接、可视化设置实时动画效果,简单设置即可引入到第三方系统中 。广泛应用于电力能源、水利、物联网、工业互联网、智慧城市、智慧医疗、智慧农业、IT运维等各行业多领域。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/399085.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

使用 Next.js 连接 mysql 数据库

前言 本文主要为大家介绍,如何使用 Next 框架实现一个简单的后端接口,并且从数据库中请求数据返回给前端。 实现 创建api/getData文件夹 项目创建完成后在 app 文件下新建api文件夹,在 api 文件夹下新建 getData 文件夹,在 ge…

Windows使用NVM安装NodeJS

*注 1、安装NVM前,建议先卸载电脑上现有的NodeJS,避免冗余。 一、NVM介绍 NVM:Node Version Manage,即Node的版本管理工具。使用NVM,可以很方便地在多个NodeJS版本之间进行切换。 由于项目开发当中,不同…

网关服务gateway注册Consul时报错Consul service ids must not be empty

网关服务gateway启动时,初始化Consul相关配置时报错。 Consul service ids must not be empty, must start with a letter, end with a letter or digit, and have as interior characters only letters, digits, and hyphen: cbda-server-gateway:10.111.236.142:…

什么是 Wake-on-LAN?如何使用 Splashtop 远程喊醒电脑

在当今数字互联的世界里,远程访问电脑已不仅仅是一种便利,而是许多人的需要。无论是远程工作、IT 支持,还是管理整个网络中的计算机群,我们都必须掌握正确的工具和技术。 其中一项在远程访问中发挥关键作用的技术是 Wake-on-LAN …

跨境ERP定制指南:5大误区,如何避免项目失败?

随着全球化进程不断推进,越来越多的企业选择跨境ERP定制,以适应不同国家和地区的业务需求。然而,ERP定制项目常常面临诸多挑战,如果不正确处理,容易导致项目失败。作为跨境ERP定制领域的专家,下面我将分享5…

科技助力快乐养老,山东恒康养老服务中心与清雷科技达成合作

谈到养老服务,大家或许会有一些刻板印象。 如果说一个落落大方、笑容温柔的90后女孩是一家养老院的院长,很多人都会感到诧异。但就是这位来自山东省龙口市恒康养老服务中心的90后院长韩雨,实现了百分百入住率、百分百好评的养老服务奇迹。 韩…

印刷企业实施MES管理系统有哪些注意事项

随着信息技术的不断发展,MES管理系统解决方案已成为提升企业生产效率、优化资源配置、加强过程控制的重要手段。对于印刷企业而言,实施MES管理系统不仅可以提高生产过程的透明度,还可以减少浪费、提升产品质量,从而增强市场竞争力…

相机图像质量研究(23)常见问题总结:CMOS期间对成像的影响--紫晕

系列文章目录 相机图像质量研究(1)Camera成像流程介绍 相机图像质量研究(2)ISP专用平台调优介绍 相机图像质量研究(3)图像质量测试介绍 相机图像质量研究(4)常见问题总结:光学结构对成像的影响--焦距 相机图像质量研究(5)常见问题总结:光学结构对成…

github开启两步验证

https://docs.github.com/en/authentication/securing-your-account-with-two-factor-authentication-2fa/configuring-two-factor-authentication 我开发的chatgpt网站: https://chat.xutongbao.top/

Adobe将类ChatGPT集成到PDF中

2月21日,全球多媒体巨头Adobe在官网宣布,推出生成式AI助手AI Assistant,并将其集成在Reader 和Acrobat 两款PDF阅读器中。 据悉,AI Assistant的功能与ChatGPT相似,可以基于PDF文档提供摘要、核心见解、基于文档内容&a…

ansible及其模块

一、ansible是什么? Ansible是一个基于Python开发的配置管理和应用部署工具,现在也在自动化管理领域大放异彩。它融合了众多老牌运维工具的优点,Pubbet和Saltstack能实现的功能,Ansible基本上都可以实现。 Ansible能批量配置、部…

使用 Nuxt 构建简单后端接口及数据库数据请求

写在前面 本文主要为大家介绍,如何使用 Nuxt 框架实现一个简单的后端接口,并且从数据库中请求数据返回给前端。 实现 创建 serverMiddleware 文件夹 首先我们新建一个名字为 serverMiddleware 文件夹用来存储接口相关信息 目录结构如下:…

Bert基础(二)--多头注意力

多头注意力 顾名思义,多头注意力是指我们可以使用多个注意力头,而不是只用一个。也就是说,我们可以应用在上篇中学习的计算注意力矩阵Z的方法,来求得多个注意力矩阵。让我们通过一个例子来理解多头注意力层的作用。以All is well…

阿里云带宽

📑前言 本文主要是如何将阿里云服务器迁移实现数据转移的文章,如果有什么需要改进的地方还请大佬指出⛺️** 🎬作者简介:大家好,我是青衿🥇 ☁️博客首页:CSDN主页放风讲故事 🌄每日…

蓝桥杯:C++素数、进制转换

素数 定义&#xff1a; 质数又称素数。一个大于1的自然数&#xff0c;除了1和它自身外&#xff0c;不能被其他自然数整除的数叫做质数&#xff1b;否则称为合数&#xff08;规定1既不是质数也不是合数&#xff09;。 代码&#xff1a; #include<bits/stdc.h> using n…

国外无人机蜂群作战典型战例及发展趋势

来源&#xff1a;飞机设计视界 作者&#xff1a;徐同乐,刘方,肖玉杰等 “人工智能技术与咨询” 发布 摘 要 随着通信组网、智能决策、协同控制等关键技术在无人机领域的推广应用&#xff0c;蜂群作战逐渐成为颠覆未来战场规则和样式的重要推手&#xff0c;其发展应用备受…

论文阅读——ONE-PEACE

ONE-PEACE: EXPLORING ONE GENERAL REPRESENTATION MODEL TOWARD UNLIMITED MODALITIES 适应不同模态并且支持多模态交互。 预训练任务不仅能提取单模态信息&#xff0c;还能模态间对齐。 预训练任务通用且直接&#xff0c;使得他们可以应用到不同模态。 各个模态独立编码&am…

物体检测-系列教程8:YOLOV5 项目配置

1、项目配置 yolo的v1、v2、v3、v4这4个都有一篇对应的论文&#xff0c;而v5在算法上没有太大的改变&#xff0c;主要是对v4做了一个更好的工程化实现 1.1 环境配置 深度学习环境安装请参考&#xff1a;PyTorch 深度学习 开发环境搭建 全教程 要求torch版本>1.6&#xf…

MapGIS 10.6 Pro前端开发低代码,快速构建WebGIS应用

随着实景三维、CIM、数字孪生等的快速发展&#xff0c;相关应用开发需求的市场增长对企业IT交付能力的要求越来越高&#xff0c;为了确保质量并实现提效降本&#xff0c;并让专业开发者更加专注于更具有价值和创新型的工作&#xff0c;低代码开发技术成为大家的优先选择。 为了…

C++/C函数指针及函数指针数组

文章目录 什么是函数指针函数指针的使用为什么要使用函数指针&#xff1f;回调函数函数指针数组及使用阅读两段有趣的代码指向成员函数的指针&#xff08;C特有&#xff09; 什么是函数指针 首先它是一个指针&#xff0c;一个指向函数的指针&#xff0c;在内存空间中存放的是函…