当前位置: 首页 > news >正文

【小沐杂货铺】基于Three.JS绘制太阳系Solar System(GIS 、WebGL、vue、react)

🍺三维数字地球系列相关文章如下🍺:
1【小沐学GIS】基于C++绘制三维数字地球Earth(456:OpenGL、glfw、glut)第一期
2【小沐学GIS】基于C++绘制三维数字地球Earth(456:OpenGL、glfw、glut)第二期
3【小沐学GIS】基于C++绘制三维数字地球Earth(456:OpenGL、glfw、glut)第三期
4【小沐学GIS】基于C++OpenSceneGraph(OSG)绘制三维数字地球Earth(7:OpenGL)
5【小沐学GIS】基于C++QT绘制三维数字地球Earth(8:OpenGL)
6【小沐学GIS】基于C++绘制太阳系SolarSystem(9:OpenGL、glfw、glut)
7【小沐学GIS】基于C#绘制三维数字地球Earth(10:OpenGL)
8【小沐学GIS】基于Python绘制三维数字地球Earth(11:OpenGL)
9【小沐学GIS】基于Android绘制三维数字地球Earth(12:OpenGL)
10【小沐学GIS】基于WebGL绘制三维数字地球Earth(13:OpenGL)
11【小沐杂货铺】基于Three.JS绘制三维数字地球Earth(GIS 、three.js、WebGL)
12【小沐杂货铺】基于Three.JS绘制三维太阳系Solar System(GIS 、three.js、WebGL)

文章目录

  • 1、Three.JS简介
  • 2、代码测试
    • A1_1_ThreeJS_SolarSystem_js_vite
    • A1_2_ThreeJS_SolarSystem_js_vite
    • A1_3_ThreeJS_SolarSystem_js
    • A1_4_ThreeJS_SolarSystem_ejs_node
    • A1_5_ThreeJS_SolarSystem_ts_vite_react
    • A1_6_ThreeJS_SolarSystem_js
    • A1_7_ThreeJS_SolarSystem_ts_vite
    • A1_8_ThreeJS_SolarSystem_js
    • A1_9_ThreeJS_SolarSystem_js_vue2
    • A1_10_ThreeJS_SolarSystem_js
  • 结语

1、Three.JS简介

https://threejs.org/

Three.js是一个基于JavaScript编写的开源3D图形库,利用WebGL技术在网页上渲染3D图形。它提供了许多高级功能,如几何体、纹理、光照、阴影等,以便开发者能够快速地创建复杂且逼真的3D场景。同时,Three.js还具有很好的跨平台和跨浏览器兼容性,让用户无需安装任何插件就可以在现代浏览器上观看3D内容。

3D 场景与模型:支持多种 3D 模型格式(如 OBJ、FBX、GLTF)和自定义几何体。
材质与光照:提供多种材质类型和光源(如点光源、平行光源),增强场景的真实感。
动画与物理引擎:支持关键帧动画和物理引擎(如 Cannon.js)。
VR 与 AR 支持:通过插件实现 VR 和 AR 体验。
交互功能:支持鼠标点击、射线检测等交互操作。

2、代码测试

A1_1_ThreeJS_SolarSystem_js_vite

在这里插入图片描述
在这里插入图片描述

A1_2_ThreeJS_SolarSystem_js_vite

在这里插入图片描述
在这里插入图片描述

A1_3_ThreeJS_SolarSystem_js

在这里插入图片描述
在这里插入图片描述

A1_4_ThreeJS_SolarSystem_ejs_node

在这里插入图片描述
在这里插入图片描述

A1_5_ThreeJS_SolarSystem_ts_vite_react

在这里插入图片描述
在这里插入图片描述

A1_6_ThreeJS_SolarSystem_js

在这里插入图片描述
在这里插入图片描述

A1_7_ThreeJS_SolarSystem_ts_vite

在这里插入图片描述
在这里插入图片描述

A1_8_ThreeJS_SolarSystem_js

在这里插入图片描述

A1_9_ThreeJS_SolarSystem_js_vue2

在这里插入图片描述
在这里插入图片描述

A1_10_ThreeJS_SolarSystem_js

在这里插入图片描述
在这里插入图片描述

结语

如果您觉得该方法或代码有一点点用处,可以给作者点个赞,或打赏杯咖啡;╮( ̄▽ ̄)╭
如果您感觉方法或代码不咋地//(ㄒoㄒ)//,就在评论处留言,作者继续改进;o_O???
如果您需要相关功能的代码定制化开发,可以留言私信作者;(✿◡‿◡)
感谢各位大佬童鞋们的支持!( ´ ▽´ )ノ ( ´ ▽´)っ!!!

相关文章:

【小沐杂货铺】基于Three.JS绘制太阳系Solar System(GIS 、WebGL、vue、react)

🍺三维数字地球系列相关文章如下🍺:1【小沐学GIS】基于C绘制三维数字地球Earth(456:OpenGL、glfw、glut)第一期2【小沐学GIS】基于C绘制三维数字地球Earth(456:OpenGL、glfw、glut)第二期3【小沐…...

Navicat17详细安装教程(附最新版本安装包和补丁)2025最详细图文教程安装手册

目录 前言:为什么选择Navicat 17? 一、下载Navicat17安装包 二、安装Navicat 1.运行安装程序 2.启动安装 3.同意“协议” 4.设置安装位置 5.创建桌面图标 6.开始安装 7.安装完成 三、安装补丁 1.解押补丁包 2.在解压后的补丁包目录下找到“w…...

记忆宫殿APP:全方位脑力与思维训练,助你提升记忆力,预防老年痴呆

记忆宫殿APP,一款专业的记忆训练软件,能去帮你提升自己的记忆能力,多样的训练项目创新的记忆方法,全方面帮你去提升你的记忆能力。 记忆宫殿APP有丰富的记忆训练项目,如瞬间记忆、短时记忆、机械记忆等,以…...

SpringBoot+Spring+MyBatis相关知识点

目录 一、相关概念 1.spring框架 2.springcloud 3.SpringBoot项目 4.注解 5.SpringBoot的文件结构 6.启动类原理 二、相关操作 1.Jar方式打包 2.自定义返回的业务状态码 3.Jackson 4.加载配置文件 5.异常处理 三、优化配置 1.简化sql语句 2.查询操作 复杂查询 一…...

【力扣hot100题】(050)岛屿数量

一开始还以为会很难很难&#xff08;以为暴力搜索会时间超限要用别的办法&#xff09;&#xff0c;没想到并不难。 我最开始是用vector<vector<bool>>记录搜索过的地域&#xff0c;每次递归遍历周围所有地域。 class Solution { public:vector<vector<char…...

Opencv计算机视觉编程攻略-第九节 描述和匹配兴趣点

一般而言&#xff0c;如果一个物体在一幅图像中被检测到关键点&#xff0c;那么同一个物体在其他图像中也会检测到同一个关键点。图像匹配是关键点的常用功能之一&#xff0c;它的作用包括关联同一场景的两幅图像、检测图像中事物的发生地点等等。 1.局部模板匹配 凭单个像素就…...

pat学习笔记

two pointers 双指针 给定一个递增的正整数序列和一个正整数M&#xff0c;求序列中的两个不同位置的数a和b&#xff0c;使得它们的和恰好为M&#xff0c;输出所有满足条件的方案。例如给定序列{1,2,3,4,5,6}和正整数M 8&#xff0c;就存在268和358成立。 容易想到&#xff1…...

MoE Align Sort在医院AI医疗领域的前景分析(代码版)

MoE Align & Sort技术通过优化混合专家模型(MoE)的路由与计算流程,在医疗数据处理、模型推理效率及多模态任务协同中展现出显著优势,其技术价值与应用意义从以下三方面展开分析: 一、方向分析 1、提升医疗数据处理效率 在医疗场景中,多模态数据(如医学影像、文本…...

大数据概念介绍

这节课给大家讲一下大数据的生态架构, 大数据有很多的产品琳琅满目, 大家看到图上就知道产品很多, 那这些产品它们各自的功能是什么, 它们又是怎么样相互配合, 来完成一整套的数据存储, 包括分析计算这样的一些任务, 这节课就要给大家进行一个分析, 那我们按照数据处理…...

Linux(2025.3.15)

1、将/etc/passwd&#xff0c;/etc/shadow,/etc/group文件复制到/ceshi; 操作&#xff1a; &#xff08;1&#xff09;在根目录下创建ceshi目录&#xff1b; &#xff08;2&#xff09;复制&#xff1b; 结果&#xff1a; 2、找到/etc/ssh目录下ssh开头的所有文件并将其复制到…...

centosububntu设置开机自启动

一、centos 1.将脚本放到/etc/rc.d/init.d路径下 2.给脚本授权 sudo chmod -R 777 脚本名称 3.添加脚本至开机启动项中 sudo chkconfig --add 脚本名称 4.开启脚本 sudo chkconfig 脚本名称 on 5.查看开机启动项中是否包含该脚本 ls /etc/rc.d/rc*.d 二、ubuntu 1.在…...

基于大模型与动态接口调用的智能系统(知识库实现)

目录 引言 1、需求背景 2、实现原理 3、实现步骤 3.1 构建知识库接口调用提示模板 3.2 动态接口配置加载 3.3 智能参数提取链 3.4 接口智能路由 3.5 建议生成链 3.6 组合完整工作流 3.7 展示效果 总结 引言 在医疗信息化快速发展的今天,我们开发了一个智能问诊系…...

23种设计模式-行为型模式-迭代器

文章目录 简介问题解决代码设计关键点&#xff1a; 总结 简介 迭代器是一种行为设计模式&#xff0c;让你能在不暴露集合底层表现形式(列表、栈和树等)的情况下遍历集合中所有的元素。 问题 集合是编程中最常使用的数据类型之一。 大部分集合使用简单列表存储元素。但有些集…...

【Java集合】ArrayList源码深度分析

参考笔记&#xff1a; java ArrayList源码分析&#xff08;深度讲解&#xff09;-CSDN博客 【源码篇】ArrayList源码解析-CSDN博客 目录 1.前言 2. ArrayList简介 3. ArrayList类的底层实现 4. ArrayList的源码Debug 4.1 使用空参构造 &#xff08;1&#xff09;开始De…...

ISIS单区域抓包分析

一、通用头部报文 Intra Domain Routing Protocol Discriminator&#xff1a;域内路由选择协议鉴别符&#xff1a;这里是ISIS System ID Length&#xff1a;NSAP地址或NET中System ID区域的长度。值为0时&#xff0c;表示System ID区域的长度为6字节。值为255时&#xff0c;表…...

关键业务数据如何保持一致?主数据管理的最佳实践!

随着业务规模的扩大和系统复杂性的增加&#xff0c;如何确保关键业务数据的一致性成为许多企业面临的重大挑战。数据不一致可能导致决策失误、运营效率低下&#xff0c;甚至影响客户体验。因此&#xff0c;主数据管理&#xff08;Master Data Management&#xff0c;简称MDM&am…...

ISIS单区域配置

一、什么是ISIS单区域 ISIS&#xff08;Intermediate System to Intermediate System&#xff0c;中间系统到中间系统&#xff09;单区域是指使用ISIS路由协议时&#xff0c;所有路由器都位于同一个区域&#xff08;Area&#xff09;内的网络配置。 二、实验拓扑 三、实验目的…...

Visual Basic语言的物联网

Visual Basic语言在物联网中的应用 引言 物联网&#xff08;IoT&#xff09;作为一种新兴的技术趋势&#xff0c;正在深刻地改变我们的生活方式与工业制造过程。在众多编程语言中&#xff0c;Visual Basic&#xff08;VB&#xff09;凭借其简单易用的特性&#xff0c;逐渐成为…...

【小沐杂货铺】基于Three.JS绘制三维数字地球Earth(GIS 、WebGL、vue、react)

&#x1f37a;三维数字地球系列相关文章如下&#x1f37a;&#xff1a;1【小沐学GIS】基于C绘制三维数字地球Earth&#xff08;456:OpenGL、glfw、glut&#xff09;第一期2【小沐学GIS】基于C绘制三维数字地球Earth&#xff08;456:OpenGL、glfw、glut&#xff09;第二期3【小沐…...

Vite环境下解决跨域问题

在 Vite 开发环境中&#xff0c;可以通过配置代理来解决跨域问题。以下是具体步骤&#xff1a; 在项目根目录下找到 vite.config.js 文件&#xff1a;如果没有&#xff0c;则需要创建一个。配置代理&#xff1a;在 vite.config.js 文件中&#xff0c;使用 server.proxy 选项来…...

嵌入式Linux开发环境搭建,三种方式:虚拟机、物理机、WSL

目录 总结写前面一、Linux虚拟机1 安装VMware、ubuntu18.042 换源3 改中文4 中文输入法5 永不息屏6 设置 root 密码7 安装 terminator8 安装 htop&#xff08;升级版top&#xff09;9 安装 Vim10 静态IP-虚拟机ubuntu11 安装 ssh12 安装 MobaXterm &#xff08;SSH&#xff09;…...

React项目在ts文件中使用router实现跳转

前言&#xff1a; 默认你已经进行了router的安装&#xff0c;目前到了配置http请求的步骤&#xff0c;在配置token失效或其他原因&#xff0c;需要实现路由跳转。在普通的 TypeScript 文件中无法直接使用Router的 useNavigate Hook。Hook 只能在 React 组件或自定义 Hook 中调用…...

Java中的正则表达式Lambda表达式

正则表达式&&Lambda表达式 正则表达式和Lambda表达式是Java编程中两个非常实用的特性。正则表达式用于字符串匹配与处理&#xff0c;而Lambda表达式则让函数式编程在Java中变得更加简洁。本文将介绍它们的基本用法&#xff0c;并结合示例代码帮助理解。同时要注意&…...

【idea设置文件头模板】

概述 设置模板&#xff0c;在创建java类时&#xff0c;统一添加内容(作者、描述、创建时间等等自定义内容)&#xff0c;给java类添加格式统一的备注信息。 1、在settings 中找到File and Code Templates 选择File Header 2、模板内容示例 /*** Author hweiyu* Descriptio…...

我与数学建模之顺遂!

下面一段时期是我一段真正走进数模竞赛的时期。 在大二上学期结束之后&#xff0c;就开始张罗队友一起报名参加美赛&#xff0c;然后同时开始学LaTeX和Matlab&#xff0c;当时就是买了本Matlab的书&#xff0c;把书上的例题还有课后题全部做完了&#xff0c;然后用latex将书上…...

【Python使用】嘿马推荐系统全知识和项目开发教程第2篇:1.4 案例--基于协同过滤的电影推荐,1.5 推荐系统评估【附代码

教程总体简介&#xff1a;1.1 推荐系统简介 学习目标 1 推荐系统概念及产生背景 2 推荐系统的工作原理及作用 3 推荐系统和Web项目的区别 1.3 推荐算法 1 推荐模型构建流程 2 最经典的推荐算法&#xff1a;协同过滤推荐算法&#xff08;Collaborative Filtering&#xff09; 3 …...

Linux makefile的一些语法

一、定义变量 1. 变量的基本语法 在 makefile 中&#xff0c;变量的定义和使用非常类似于编程语言中的变量。变量的定义格式&#xff08;最好不要写空格&#xff09;如下&#xff1a; VARIABLE_NAMEvalue 或者 VARIABLE_NAME:value 表示延迟赋值&#xff0c;变量的值在引…...

Educational Codeforces Round 177 (Rated for Div. 2)(A-D)

题目链接&#xff1a;Dashboard - Educational Codeforces Round 177 (Rated for Div. 2) - Codeforces A. Cloudberry Jam 思路 小数学推导问题&#xff0c;直接输出n*2即可 代码 void solve(){int n;cin>>n;cout<<n*2<<"\n"; } B. Large A…...

第十八节课:Python编程基础复习

课程复习 前三周核心内容回顾 第一周&#xff1a;Python基本语法元素 基础语法&#xff1a;缩进、注释、变量命名、保留字数据类型&#xff1a;字符串、整数、浮点数、列表程序结构&#xff1a;赋值语句、分支语句&#xff08;if&#xff09;、函数输入输出&#xff1a;inpu…...

动物多导生理信号采集分析系统技术简析

一 技术参数 通道数&#xff1a;通道数量决定了系统能够同时采集的生理信号数量。如中南大学湘雅医学院的生物信号采集系统可达 128 通道&#xff0c;OmniPlex 多导神经信号采集分析系统支持 16、32、64、128 通道在体记录。不过&#xff0c;这个也要看具体的应用场景&#xff…...

Linux——Linux系统调用函数练习

一、实验名称 Linux系统调用函数练习 二、实验环境 阿里云服务器树莓派 三、实验内容 1. 远程登录阿里云服务器 2. 创建目录 操作步骤&#xff1a; mkdir ~/xmtest2 cd ~/xmtest2结果&#xff1a; 成功创建并进入homework目录。 3. 编写C代码 操作步骤&#xff1a; …...

列表与列表项

认识列表和列表项 FreeRTOS 中的 列表&#xff08;List&#xff09; 和 列表项&#xff08;ListItem&#xff09;是其内核实现的核心数据结构&#xff0c;广泛用于任务调度、队列管理、事件组、信号量等模块。它们通过双向链表实现&#xff0c;支持高效的元素插入、删除和遍历…...

mofish软件(MacOS版本)手动初始化

mofish软件手动初始化MacOS 第一步&#xff0c;打开终端 command空格键唤起搜索页面&#xff0c;输入终端&#xff0c;点击打开终端 第二步&#xff0c;进入mofish配置目录,删除初始化配置文件 在第一步打开的终端中输入如下命令后按回车键&#xff0c;删除mofish配置文件 …...

基于javaweb的SpringBoot图片管理系统图片相册系统设计与实现(源码+文档+部署讲解)

技术范围&#xff1a;SpringBoot、Vue、SSM、HLMT、Jsp、PHP、Nodejs、Python、爬虫、数据可视化、小程序、安卓app、大数据、物联网、机器学习等设计与开发。 主要内容&#xff1a;免费功能设计、开题报告、任务书、中期检查PPT、系统功能实现、代码编写、论文编写和辅导、论文…...

密码学基础——DES算法

前面的密码学基础——密码学文章中介绍了密码学相关的概念&#xff0c;其中简要地对称密码体制(也叫单钥密码体制、秘密密钥体制&#xff09;进行了解释&#xff0c;我们可以知道单钥体制的加密密钥和解密密钥相同&#xff0c;单钥密码分为流密码和分组密码。 流密码&#xff0…...

我与数学建模之波折

我知道人生是起起伏伏&#xff0c;但没想到是起起伏伏伏伏伏伏 因为简单讲讲&#xff0c;所以我没讲很多生活上的细节&#xff0c;其实在7月我和l学长一起在外面租房子备赛。这个时间节点其实我不太愿意讲&#xff0c;但是逃不了&#xff0c;那段时间因其他事情导致我那段时间…...

离线部署kubesphere(已有k8s和私有harbor的基础上)

前言说明&#xff1a;本文是在已有k8s集群和私有仓库harbor上进行离线安装kubesphere&#xff1b;官网的离线教程写都很详细&#xff0c;但是在部署部份把搭建集群和搭建仓库也写一起了&#xff0c;跟着做踩了点坑&#xff0c;这里就记录下来希望可以帮助到需要的xdm。 1.根据官…...

量子计算入门:Qiskit实战量子门电路设计

引言&#xff1a;量子计算的编程基石 量子门是量子计算的基本操作单元&#xff0c;其通过操控量子比特的叠加与纠缠实现并行计算。IBM开发的Qiskit框架为量子算法设计与模拟提供了强大工具。本文将从量子门基础、Qiskit实战、量子隐形传态案例三个维度&#xff0c;结合代码解析…...

AIGC8——大模型生态与开源协作:技术竞逐与普惠化浪潮

引言&#xff1a;大模型发展的分水岭时刻 2024年成为AI大模型发展的关键转折点&#xff1a;OpenAI的GPT-4o实现多模态实时交互&#xff0c;中国DeepSeek-MoE-16b模型以1/8成本达到同类90%性能&#xff0c;而开源社区如Mistral、LLama 3持续降低技术门槛。这场"闭源商业巨…...

FPGA练习

文章目录 一、状态机思想写一个 LED流水灯的FPGA代码二、 CPLD和FPGA芯片的主要技术区别是什么&#xff1f; 它们各适用于什么场合&#xff1f;1、CPLD适用场景2、FPGA适用场景 三、 在hdlbitsFPGA教程网站上进行学习1、练习题12、练习题2练习题3练习题4练习题5 一、状态机思想…...

阿里云服务器遭遇DDoS攻击有争议?

近年来&#xff0c;阿里云服务器频繁遭遇DDoS攻击的事件引发广泛争议。一方面&#xff0c;用户质疑其防御能力不足&#xff0c;导致服务中断甚至被迫进入“黑洞”&#xff08;清洗攻击流量的隔离机制&#xff09;&#xff0c;轻则中断半小时&#xff0c;重则长达24小时&#xf…...

leetcode-代码随想录-哈希表-有效的字母异位词

题目 题目链接&#xff1a;242. 有效的字母异位词 - 力扣&#xff08;LeetCode&#xff09; 给定两个字符串 s 和 t &#xff0c;编写一个函数来判断 t 是否是 s 的 字母异位词。 输入: s "anagram", t "nagaram" 输出: true输入: s "rat",…...

kotlin中主构造函数是什么

一 Kotlin 中的主构造函数 主构造函数&#xff08;Primary Constructor&#xff09;是 Kotlin 类声明的一部分&#xff0c;用于在 创建对象时初始化类的属性。它不像 Java 那样是一个函数体&#xff0c;而是紧跟在类名后面。 主构造函数的基本定义 class Person(val name: S…...

Julia语言的测试覆盖率

Julia语言的测试覆盖率探讨 引言 在现代软件开发中&#xff0c;测试是确保软件质量的重要环节。随着软件的复杂度不断增加&#xff0c;测试覆盖率作为衡量测试质量的一个重要指标&#xff0c;受到了越来越多开发者的关注。Julia语言作为一种高性能的动态编程语言&#xff0c;…...

Apache httpclient okhttp(2)

学习链接 Apache httpclient & okhttp&#xff08;1&#xff09; Apache httpclient & okhttp&#xff08;2&#xff09; okhttp github okhttp官方使用文档 okhttp官方示例代码 OkHttp使用介绍 OkHttp使用进阶 译自OkHttp Github官方教程 SpringBoot 整合okHttp…...

BUUCTF-web刷题篇(10)

19.EasyMD5 md5相关内容总结&#xff1a; ①string md5(&str,raw) $str:需要计算的字符串&#xff1b; raw:指定十六进制或二进制输出格式。计算成功&#xff0c;返回md5值&#xff0c;计算失败&#xff0c;返回false。 raw参数为true&#xff1a;16个字符的二进制格式&…...

CCF GESP C++编程 五级认证真题 2025年3月

C 五级 2025 年 03 月 题号 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 答案 A A B B D C A D A B C A A D B 1 单选题 第 1 题 链表不具备的特点是( )。 A. 可随机访问任何一个元素 B. 插入、删除操作不需要移动元素 C. 无需事先估计存储空间大小 D. 所需存储空间与存储元素个数成…...

【AI学习】MCP的简单快速理解

最近&#xff0c;AI界最火热的恐怕就是MCP了。作为一个新的知识点&#xff0c;学习的开始&#xff0c;先摘录一些信息&#xff0c;从发展历程、通俗介绍到具体案例&#xff0c;这样可以快速理解MCP。 MCP发展历程 来自i陆三金 Anthropic 开发者关系负责人 Alex Albert&#…...

文档处理利器Docling,基于LangChain打造RAG应用

大家好&#xff0c;人工智能应用持续发展&#xff0c;对文档信息的有效处理、理解与检索提出了更高要求。大语言模型虽已在诸多领域发挥重要作用&#xff0c;但在文档处理方面仍有提升空间。 本文将详细阐述如何整合Docling 和 LangChain&#xff0c;创建检索增强生成&#xf…...

深度学习图像分类数据集—枣子水果成熟度分类

该数据集为图像分类数据集&#xff0c;适用于ResNet、VGG等卷积神经网络&#xff0c;SENet、CBAM等注意力机制相关算法&#xff0c;Vision Transformer等Transformer相关算法。 数据集信息介绍&#xff1a;3种枣子水果成熟度数据&#xff1a;g&#xff0c;r&#xff0c;y&#…...