three.js捋文档的记录笔记(五):threejs引入

地址1:http://www.webgl3d.cn/pages/aac9ab/
地址2:http://www.webgl3d.cn/Three.js/
(作者:郭隆邦 该说不说 大佬真牛 整的教程通俗易懂还详细)

本地静态服务器

vscode配置live-server插件 在官网案例里打开对应.html文件,右键点击Open with Live Server即可

扩展:nodejs配置本地静态服务器

如果不用代码编辑器创建本地静服务器,也可以用nodejs配置。
安装nodejs,然后npm安装live-server插件,安装后,进入课件或threejs官方文件根目录,输入live-server命令即可预览3D案例。

项目的开发环境引入threejs

import * as THREE from 'three';

其他的扩展库 就用啥引啥

// 引入扩展库OrbitControls.js
import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
// 引入扩展库GLTFLoader.js
import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';

注意一下版本问题 引入的路径不一样 我之前引入失败不晓得是不是该原因导致的
这里需要注意:扩展库引入——旧版本,比如122, 新版本路径addons替换了examples/jsm

import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js'; 
<script src="./build/three.js"></script>

script的src也能引入 (给script标签设置type=“module”,也可以在.html文件中使用import方式引入three.js 是ES6的引入方式)

threejs官方案例的引入方式 配置<script type="importmap">

<!-- 具体路径配置,你根据自己文件目录设置,我的是课件中源码形式 -->
<script type="importmap">{"imports": {"three": "../../../three.js/build/three.module.js"}}
</script>

时间充裕的话 还是建议看看原作者的文档 非常详细 有很多小细节 通俗易懂 我这里都是摘的我自己想记的

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

K8S一 k8s基础知识及实战

一 K8S 概览 1.1 K8S 是什么&#xff1f; K8S官网文档&#xff1a;https://kubernetes.io/zh/docs/home/ K8S 是Kubernetes的全称&#xff0c;源于希腊语&#xff0c;意为“舵手”或“飞行员”&#xff0c;官方称其是&#xff1a;用于自动部署、扩展和管理“容器化&#xff08…

软考 系统架构设计师系列知识点之大数据设计理论与实践(5)

接前一篇文章&#xff1a;软考 系统架构设计师系列知识点之大数据设计理论与实践&#xff08;4&#xff09; 所属章节&#xff1a; 第19章. 大数据架构设计理论与实践 第3节 Lambda架构 19.3.1 Lambda架构对大数据处理系统的理解 Lambda架构由Storm的作者Nathan Marz提出&…

目标检测与图像分类的区别(概念)

目标检测和图像分类是计算机视觉领域的两个重要任务&#xff0c;它们有一些关键的区别&#xff1a; 1、任务目标 图像分类&#xff1a;图像分类的任务是将输入的图像分为不同的类别&#xff0c;通常是预定义的类别集合。在这种任务中&#xff0c;算法的目标是确定图像中包含的…

伺服系统中电机磁极偏角自学习的实现方案

一、 电机磁极偏角自学习原理简述 要知道磁极偏角&#xff0c;首先要明确的是磁极角&#xff0c;在我个人的理解里磁极角就是park和Ipark变换里所需的电角度&#xff0c;我们的矢量控制方法是定磁链的&#xff0c;就是要保证两相同步旋转坐标系的Id轴和三相静止坐标系的A轴要重…

45---M.2 SSD电路设计

视频链接 M.2 SSD硬件电路设计01_哔哩哔哩_bilibili M.2 SSD电路设计 1、M.2简介 1.1、M.2基本介绍 M.2接口也叫NGFF&#xff0c;英文全称Next Generation Form Factor。M.2接口是为超极本&#xff08;Ultrabook&#xff09;量身定做的新一代接口标准&#xff0c;是Intel推…

nginx优化总结及系统内核优化

一、nginx优化 1. 性能优化&#xff1a; 需求内容实现IO多路复用use epoll;设置工作进程数worker_processes 与CPU数量相同或auto;工作进程静态绑核worker_cpu_affinity设置并发worker_connections worker_rlimit_nofile连接保持超时keepalive_timeout 服务器超时时间 [客户端…

2024年150道高频Java面试题(二十八)

55. 解释一下 Java 中的等待/通知机制。 Java中的等待/通知机制是线程间通信的一种方式&#xff0c;它通过Object类的三个方法来实现&#xff1a;wait(), wait(long timeout), 和 notify(), 以及 notifyAll()。 wait(): 当一个线程调用一个共享对象的 wait() 方法时&#xff…

Java实现二叉树(下)

1.前言 http://t.csdnimg.cn/lO4S7 在前文我们已经简单的讲解了二叉树的基本概念&#xff0c;本文将讲解具体的实现 2.基本功能的实现 2.1获取树中节点个数 public int size(TreeNode root){if(rootnull){return 0;}int retsize(root.left)size(root.right)1;return ret;}p…

蓝桥杯每日一题:奶牛回家(最短路径)

晚餐时间马上就到了&#xff0c;奶牛们还在各自的牧场中悠闲的散着步。 当农夫约翰摇动铃铛&#xff0c;这些牛就要赶回牛棚去吃晚餐。 在吃晚餐之前&#xff0c;所有奶牛都在自己的牧场之中&#xff0c;有些牧场中可能没有奶牛。 每个牧场都通过一条条道路连接到一个或多个…

【C++算法模板】KMP算法:字符串匹配算法

文章目录 0&#xff09;概述1&#xff09;求解next数组2&#xff09;求解匹配位置的核心函数3&#xff09;完整代码 0&#xff09;概述 在做模式串与文本串的匹配问题时&#xff0c;匹配失败时&#xff0c;如果每次都只向后递进一位&#xff0c;时间复杂度为 O ( n m ) O(nm…

314_C++_QT表格的撤销、恢复,可对多行、多item进行撤销、恢复操作

行–删除后的,撤销、恢复图示: 原图示 删除后 撤销操作 恢复操作 item修改后的撤销、恢复 原item 撤销修改 恢复修改 代码: --</

[开发日志系列]PDF图书在线系统20240415

20240414 Step1: 创建基础vueelment项目框架[耗时: 1h25min(8:45-10:10)] 检查node > 升级至最新 (考虑到时间问题,没有使用npm命令行执行,而是觉得删除重新下载最新版本) > > 配置vue3框架 ​ 取名:Online PDF Book System 遇到的报错: 第一报错: npm ERR! …

实时避障系统开启盲人独立出行新时代

作为一名资深记者&#xff0c;我始终关注并报道科技如何助力特殊群体克服生活挑战的创新实践。近期&#xff0c;我有幸深入了解了一款专为盲人设计的辅助应用叫做蝙蝠避障&#xff0c;它以实时避障系统为核心&#xff0c;为视障人士独自出行提供了强有力的支持&#xff0c;悄然…

服务器挖矿病毒解决ponscan,定时任务解决

服务器挖矿病毒解决ponscan&#xff0c;定时任务解决 挖矿病毒会隐藏chattr的操作权限&#xff0c;让我们无法删除病毒文件&#xff0c;杀掉病毒进程。所以要去下载chattr.c的文件&#xff0c;编译成a.out。然后再对原来的chattr文件的权限进行修改。然后覆盖掉它。 chattr.c …

JavaFX制作login页面

JavaFx制作简单的login页面demo public class LoginFxDemo extends Application {public static void main(String[] args) {Application.launch(args);}Overridepublic void start(Stage primaryStage) throws Exception {Label nLabel new Label("姓名:");nLabel.…

编曲知识19:自动化处理 发送原理 混响 延迟

自动化处理 发送原理 混响 延迟小鹅通-专注内容付费的技术服务商https://app8epdhy0u9502.pc.xiaoe-tech.com/live_pc/l_661a68eae4b023c0a96a8b36?course_id=course_2XLKtQnQx9GrQHac7OPmHD9tqbv 自动化处理 自动化 鼠标挪动到轨道左下角打开自动化轨道 或右键轨道-左键单击…

Softmax函数和Sigmoid函数的思考

【为什么 Softmax 函数面对二分类问题时可以简化为 Sigmoid 函数】 将二分类问题当成普通多分类问题&#xff0c;神经网络如下所示&#xff1a; 因为有两个分类&#xff0c;所以需要有两个输出&#xff0c;然后经过 Softmax 后得到每个分类的预测概率。 假设第一个分类的得分…

独孤思维:喜欢看小姐姐跳舞,没法赚钱

01 独孤写文章的第一年&#xff0c;有一个同行特别有意思。 主动找我&#xff0c;说文章写得不错&#xff0c;想打赏。 但是我没开打赏功能。 当时&#xff0c;我说感觉写得并不好&#xff0c;就没好意思开。 他说&#xff0c;没关系的&#xff0c;他就觉得写得好&#xf…

SpringBoot 日志系统解析

日志实现框架 常见框架: JULLogbacLog4jLog4j2 日志实现的抽象层 避免代码的改动影响用户的使用, 常见的: JCLSLF4J 日志发展历程 JDK1.3及以前, 通过System.(out | err).println打印, 存在巨大缺陷解决系统打印缺陷问题出现log4,2015年8月停止更新受到log4j影响, SUN公…

AI助力,程序员压力倍增?

讲动人的故事,写懂人的代码 你知道程序员现在在AI辅助编程时最头疼的事情是什么吗?就是怎么在改代码的时候保住小命。 大家都听过程序员因为工作太累导致过劳湿的事情。 无论是写新功能、修bug,还是更改系统配置,都得改代码。 现在有了AI的帮助,本应该轻松很多,为什么…