基于threejs的开源webgl编辑器,有web和桌面应用两个版本(webgl和threejs区别)

基于threejs的开源webgl编辑器,有web和桌面应用两个版本!维护更新活跃!

  • nunuStudio 是一个开源的网络游戏引擎,它允许设计师和网络开发人员轻松开发网络 3D 体验。
  • Powered by three.js可以直接在 Web 中运行,也可以通过 nwjs.io 导出为桌面应用程序。
  • 功能齐全的可视化编辑器,支持多种文件格式,工具是开源的,完全免费用于个人和商业用途。
  • 视觉场景编辑器、代码编辑器、用于编辑纹理、材质、粒子发射器的可视化工具和强大的脚本 API,允许使用JavaScript或Python创建复杂的应用程序。
  • 项目页面上提供了功能齐全的网络版编辑器。
  • 网页版经过Firefox、Chrome和Microsoft Edge测试,也支持移动浏览器。

基于threejs的开源webgl编辑器,有web和桌面应用两个版本(webgl和threejs区别)

  • 提供有关每个模块内部工作的完整详细信息的API 文档。这些也可以通过运行从项目源代码生成npm run docs。
  • 项目页面上提供了基本教程。基本教程逐步解释了如何使用编辑器。
  • 要构建项目,首先安装Node.js LTS和 NPM:构建系统为运行时和编辑器生成缩小的构建文档生成使用YuiDocsnpm install –legacy-peer-deps通过运行和附加的非 npm 包使用从 npm 安装依赖项npm run napa构建编辑器、运行时和文档、运行npm run build
  • 该项目的网页是使用Angular构建的,并托管在GitHub Pages 上

截图

基于threejs的开源webgl编辑器,有web和桌面应用两个版本(webgl和threejs区别)基于threejs的开源webgl编辑器,有web和桌面应用两个版本(webgl和threejs区别)基于threejs的开源webgl编辑器,有web和桌面应用两个版本(webgl和threejs区别)基于threejs的开源webgl编辑器,有web和桌面应用两个版本(webgl和threejs区别)基于threejs的开源webgl编辑器,有web和桌面应用两个版本(webgl和threejs区别)基于threejs的开源webgl编辑器,有web和桌面应用两个版本(webgl和threejs区别)

特征

  • 可视化应用编辑器
    • 将文件直接拖放到项目中(图像、视频、模型……)
    • 管理项目资源。
    • 编辑材质、纹理、着色器、代码……
  • 由 cannon.js基于带物理的three.js库构建
    • 实时光照和阴影贴图支持
    • 三.js库可以导入编辑器
    • 支持多种文件格式(gltf、dae、obj、fbx、3ds、…)
  • 用于桌面和移动部署的NW.js和Cordova导出
  • 与用于虚拟现实和增强现实的WebXR兼容
  • 该项目使用Webpack构建和捆绑其代码库。
    • 构建系统为运行时和编辑器生成缩小的构建
    • 使用Uglify优化和缩小 JavaScript
    • 文档生成使用YuiDocs
  • 要构建项目,首先安装Java、Node.js和 NPM,并确保 java 命令正常工作。
  • 通过运行npm install一些依赖项从 npm 安装依赖项在 npm 上不可用,必须通过运行来安装npm install napa
  • 安装项目网页运行的依赖cd source/page && npm install
  • 构建编辑器、运行时和文档、运行npm run build

嵌入应用程序

  • 开发的应用程序可以嵌入到现有的网页中,并与Angular或React等框架兼容。
  • 要将应用程序嵌入 HTML 页面,可以使用以下代码,使用该loadApp(file, id)方法引导应用程序。

<html> <head> <script src="nunu.min.js"></script> </head> <body onload="Nunu.App.loadApp('pong.nsp', 'canvas')"> <canvas width="800" height="480" id="canvas"></canvas> </body></html>

Vue.js 与 Nuxtjs

  • 构建nunu.min.js并放置到static/js您的 nuxt 实例的文件夹中
  • 将画布元素放置template在您想要的区域中,例如:

<template> <div> <canvas id="canvas" width="800" height="480" /></div></template>

  • 将脚本添加到您希望进行的 3D 集成的页面的 head 函数中(或放置在全局 head 中)

head() {return { script: [ { hid: 'Nunu', src: 'assets/js/nunu.min.js', defer: true, callback: () => { Nunu.App.loadApp('assets/file.nsp', 'canvas') //add file to load in here }, }, ], }, }

  • 您现在可以Nunu像往常一样在应用程序中解决问题。

执照

  • 该项目是在 MIT 许可下分发的,该许可允许该平台的商业使用而无需任何费用。
  • 许可证在项目 GitHub 页面上可用

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

(0)
上一篇 2022年10月29日 上午8:05
下一篇 2022年10月29日 上午8:07

相关推荐

  • 重庆项目管理

    重庆项目管理 重庆项目管理是一个非常重要的领域,涉及到项目的规划、执行和监督。在重庆市的经济发展中,项目管理是至关重要的一环。本文将介绍重庆项目管理的基本概念、方法和挑战。 重庆项…

    科研百科 2024年8月15日
    48
  • 简增庆

    简增庆: 一个真正的勇士 简增庆是一位真正的勇士,他的故事令人敬佩。他出生在一个贫困的家庭,但他并没有被这些困难所打倒。他在学校里勤奋学习,不断提高自己的能力。 简增庆长大后,他加…

    科研百科 2024年11月19日
    0
  • 那些被网贷毁掉的年轻人(那些被网贷毁掉的90后)

    “如果还得起,也就不会退学了。”由于无法偿还10多万元的网贷债务,李科无奈从四川一所高校退学。 由于女朋友在外地,为了维系感情,李科经常给对方买礼物。不过,无论是靠校园内推销一些日…

    2022年6月1日
    300
  • 2022年个人档案管理的具体流程和方法(2022年个人档案管理的具体流程和方法是什么)

    根据我国档案法的现行规定,个人档案严禁自己保管,不得个人自持或保管个人档案,必须存放在专业的具有人事权的机关单位进行档案保管。任何人或单位不得在没有得到允许的条件下保管个人档案,我…

    科研百科 2024年4月26日
    103
  • 宫颈癌筛查科研项目

    宫颈癌筛查科研项目: 预防宫颈癌的方法 宫颈癌是女性常见的一种恶性肿瘤,它的危害不仅仅是影响女性的身体健康,还会给家庭和社会带来巨大的经济负担。因此,预防宫颈癌是至关重要的。本文将…

    科研百科 2025年4月27日
    0
  • 科研项目验收报告ppt格式

    科研项目验收报告PPT格式 随着科技的不断发展,科研项目的验收已成为一项非常重要的任务。验收报告是项目完成后的一个重要文档,它包含了项目完成的情况和成果,同时也为项目管理人员和验收…

    科研百科 2025年5月30日
    1
  • 工程项目档案管理系统

    工程项目档案管理系统 随着工程项目的增多,工程项目档案管理系统变得越来越重要。这个系统可以帮助项目管理人员和文件管理员更好地管理工程项目的文件和资料,提高工作效率。本文将介绍工程项…

    科研百科 2024年8月28日
    29
  • 聘用合同的法律依据(聘用合同管理办法)

    聘用合同管理办法 为加强和规范聘用合同管理,保护劳动者的合法权益,根据《中华人民共和国劳动法》和其他相关法律、行政法规的规定,制定本管理办法。 第一章 总则 第一条 为加强和规范聘…

    科研百科 2024年6月8日
    142
  • 公司项目管理信息系统

    公司项目管理信息系统 随着数字化时代的到来,企业项目管理信息系统(ERP)成为了企业 management 的重要工具。公司项目管理信息系统可以帮助企业更好地管理项目,提高项目管理…

    科研百科 2024年5月26日
    99
  • 近三年主持的科研项目

    近三年主持的科研项目 近年来,随着科技的不断发展,科研项目已经成为推动科技进步的重要力量。作为一位科学家,主持科研项目是我感到最为自豪的事情之一。在过去的三年里,我主持了多项科研项…

    科研百科 2025年6月1日
    0