服务器之家:专注于VPS、云服务器配置技术及软件下载分享
分类导航

PHP教程|ASP.NET教程|Java教程|ASP教程|编程技术|正则表达式|C/C++|IOS|C#|Swift|Android|VB|R语言|JavaScript|易语言|vb.net|

服务器之家 - 编程语言 - 编程技术 - 十个超炫酷的前端 3D 开源项目

十个超炫酷的前端 3D 开源项目

2024-03-01 14:19前端充电宝 编程技术

本文将分享 10 个超炫酷的前端 3D 开源项目。从令人惊叹的视觉效果到富有创新概念的交互体验,这些项目展示了前端技术的无限可能。无论你是新手还是经验丰富的开发者,都值得一探究竟!

十个超炫酷的前端 3D 开源项目

本文将分享 10 个超炫酷的前端 3D 开源项目。从令人惊叹的视觉效果到富有创新概念的交互体验,这些项目展示了前端技术的无限可能。无论你是新手还是经验丰富的开发者,都值得一探究竟!

蛋仔派对(three.js版)

利用 React + threejs 技术栈构建的第三人称Q版闯关类游戏。

十个超炫酷的前端 3D 开源项目

Github:https://github.com/Steve245270533/react-three-egg。

历史时间线

通过 3D 地球的形式直观地显示各个历史时间段及历史地图。

十个超炫酷的前端 3D 开源项目

Github:https://github.com/gonnavis/Timeline。

3D 球体抽奖程序

年会抽奖程序,基于 Express + Three.js 的 3D 球体抽奖程序,奖品,文字,图片,抽奖规则均可配置,抽奖人员信息Excel一键导入,抽奖结果Excel导出,给你的抽奖活动带来全新酷炫体验。

十个超炫酷的前端 3D 开源项目

Github:https://github.com/moshang-xc/lottery。

three-sokoban-live

基于 Vite、TypeScript、Three.js 的 3D 推箱子游戏。

十个超炫酷的前端 3D 开源项目

3d-earth

使用 Webpack 5 + TypeScript + Threejs 搭建的 3D 地球。

十个超炫酷的前端 3D 开源项目

Github:https://github.com/ertugrulcetin/racing-game-cljs。

T-Rex Run

T-Rex Run 3D 是一款模仿 Google Chrome 霸王龙快跑而制作的 ThreeJS WebGL 游戏。

十个超炫酷的前端 3D 开源项目

Github:https://github.com/Priler/dino3d。

Rubik Cube

ThreeJs 制作的魔方游戏,支持自定义魔方阶级(目前界面上只开放 2 - 10 阶魔方)。

十个超炫酷的前端 3D 开源项目

Github:https://github.com/pengfeiw/rubiks-cube。

3D 模型查看器

使用 Vue 3 、Three.js 的 3D 模型查看器。

十个超炫酷的前端 3D 开源项目

Github:https://github.com/hujiulong/vue-3d-model。

探索three.js

一个免费的 Three.js 入门书籍:《探索 three.js》

十个超炫酷的前端 3D 开源项目

在线阅读:https://discoverthreejs.com/zh/book/。

原文地址:https://mp.weixin.qq.com/s/7mkvkmF-fv1UkCxL-4gRSw

延伸 · 阅读

精彩推荐
  • 编程技术POST与GET方法的区别简要分析

    POST与GET方法的区别简要分析

    原理介绍:理论上说,GET是从服务器上请求数据,POST是发送数据到服务器。事实上,GET方法是把数据参数队列(query string)加到一个URL上,值和表单是一一...

    服务器之家1642020-07-05
  • 编程技术一篇文章带你了解CSS Pseudo-Classes(伪类)

    一篇文章带你了解CSS Pseudo-Classes(伪类)

    本文基于CSS基础,介绍了CSS中的伪类,从什么是伪类,常见的伪类的用法( first-child,: last-seudo,: nth-child,: lang)最后介绍了伪类可以与CSS类结合使用。...

    前端进阶学习交流4092021-10-22
  • 编程技术十分钟搞定前端虚拟列表

    十分钟搞定前端虚拟列表

    虚拟列表的概念就出现了,随后又出现了各种各样的虚拟列表库。通过将可视区域内和可见区域外的数据进行动态切换,虚拟列表可以极大地提升列表滚动...

    前端充电宝12032023-11-30
  • 编程技术一文讲清base64编码原理

    一文讲清base64编码原理

    本文主要介绍了一文讲清base64编码原理,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编...

    JyLie7152023-05-25
  • 编程技术Websocket直播间聊天室教程 GoEasy快速实现聊天室

    Websocket直播间聊天室教程 GoEasy快速实现聊天室

    这篇文章主要介绍了Websocket直播间聊天室教程 GoEasy快速实现聊天室,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价...

    编程技术网2812020-08-25
  • 编程技术Angular中setTimeout有什么作用?你知道吗?

    Angular中setTimeout有什么作用?你知道吗?

    总的来说,setTimeout 通常用于处理异步代码、延迟执行、或者等待一些状态变更之后执行特定的操作。在Angular应用中,使用得当可以确保代码的正确执行顺...

    金木讲编程4182023-12-07
  • 编程技术解决 Github 等网络问题的七种方案

    解决 Github 等网络问题的七种方案

    网络问题应该是每一个开发者绕不过的问题,不管是 Python 开发者,还是 Go 工程师,或者你是其他语言的,你也肯定绕不开 Github 这个宝库。...

    Python编程时光10432021-11-29
  • 编程技术未来十年你应该学的三门编程语言

    未来十年你应该学的三门编程语言

    在IT界摸爬滚打十多年后,我发现以下三门编程语言未来的潜力十分巨大。下面,我们一起来看。...

    程序员书库7072021-08-18