微信小程序threejs三维开发
微信小程序threejs开发
import * as THREE from 'three';
const {
performance,
document,
window,
HTMLCanvasElement,
requestAnimationFrame,
cancelAnimationFrame,
core,
Event,
Event0
} = THREE .DHTML
import Stats from 'three/examples/jsm/libs/stats.module.js';
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
import { OrbitControls0 } from 'three/examples/jsm/controls/OrbitControls0.js';
import { RoomEnvironment } from 'three/examples/jsm/environments/RoomEnvironment.js';
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';
import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader.js';
var requestId
Page({
onUnload() {
cancelAnimationFrame(requestId, this.canvas)
this.worker && this.worker.terminate()
if(this.canvas) this.canvas = null
setTimeout(() => {
if (this.renderer instanceof THREE.WebGLRenderer) {
this.renderer.dispose()
this.renderer.forceContextLoss()
this.renderer.context = null
this.renderer.domElement = null
this.renderer = null
}
}, 10)
},
webgl_touch(e){
const web_e = (window.platform=="devtools"?Event:Event0).fix(e)
this.canvas.dispatchEvent(web_e)
},
onLoad() {
document.createElementAsync("canvas", "webgl2",this).then(canvas => {
this.canvas = canvas
this.body_load(canvas).then()
})
},
async body_load(canvas3d) {
let mixer;
const clock = new THREE.Clock();
const container = document.getElementById('container');
const stats = new Stats();
container.appendChild(stats.dom);
const renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.setPixelRatio( window.devicePixelRatio );
renderer.setSize( window.innerWidth, window.innerHeight );
container.appendChild( renderer.domElement );
const pmremGenerator = new THREE.PMREMGenerator( renderer );
const scene = new THREE.Scene();
var AmbientLight = new THREE.AmbientLight(0xffffff,1)
scene.add(AmbientLight)
///
/*
var spotLight = new THREE.SpotLight(0xaaaaaa, 1) //聚光灯
spotLight.position.set(0, 0, 10)
spotLight.lookAt(scene.position)
scene.add(spotLight)*/
//
/*
var directionalLight = new THREE.DirectionalLight(0xaaaaaa, 1) //方向光
directionalLight.position.set(0, 0, 10)
directionalLight.lookAt(scene.position)
scene.add(directionalLight)*/
scene.background = new THREE.Color( 0xbfe3dd );
scene.environment = pmremGenerator.fromScene( new RoomEnvironment( renderer ), 0.04 ).texture;
const camera = new THREE.PerspectiveCamera(40, window.innerWidth / window.innerHeight, 1, 100);
camera.position.set(5, 2, 8);
const controls = new (window.platform=="devtools"?OrbitControls:OrbitControls0)(camera, renderer.domElement);
controls.target.set(0, 0.5, 0);
controls.update();
controls.enablePan = true;
controls.enableDamping = true;
const dracoLoader = this.dracoLoader = new DRACOLoader();
dracoLoader.setDecoderPath('jsm/libs/draco/gltf/');
const loader = new GLTFLoader();
loader.setDRACOLoader(dracoLoader);
//loader.load('https://statics.jiuqianqu.com/btwc-file/20230222/1677055512471.glb', function (gltf) {
loader.load('models/gltf/LittlestTokyo.glb', function (gltf) {
//console.error("xxxxxxx",gltf)
/* gltf.scene.traverse(function (child) {
if (child.isMesh) {
child.frustumCulled = false;
//模型阴影
child.castShadow = true;
//模型自发光
child.material.emissive = child.material.color;
child.material.emissiveMap = child.material.map;
}
})*/
const model = gltf.scene;
model.position.set(1, 1, 0);
model.scale.set(0.01, 0.01, 0.01);
scene.add(model);
mixer = new THREE.AnimationMixer(model);
mixer.clipAction(gltf.animations[0]).play();
animate();
},null, function (e) {
console.error(e);
});
window.onresize = function () {
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize(window.innerWidth, window.innerHeight);
};
function animate() {
requestId = requestAnimationFrame(animate);
const delta = clock.getDelta();
mixer.update(delta);
controls.update();
// //stats.update();
renderer.render(scene, camera);
}
}
})
相关文章:
微信小程序threejs三维开发
微信小程序threejs开发 import * as THREE from three; const { performance, document, window, HTMLCanvasElement, requestAnimationFrame, cancelAnimationFrame, core, Event, Event0 } THREE .DHTML import Stats from three/examples/jsm/libs/stats.module.js; im…...
Starship:快速且高度可定制的命令行框架!!
Starship 是一款专为开发者设计的现代、快速且高度可定制的命令行框架。它通过简洁的界面提供丰富的环境信息,帮助用户更高效地进行日常开发工作。 软件介绍: Starship 是用 Rust 编写的开源项目,以其轻量级和极速启动而著称。它能够跨平台运…...
流水线(Pipeline)
在现代 CPU 设计中,流水线(Pipeline) 是将指令处理拆分为多个阶段以提高执行效率的关键技术。为了更精细地分析性能,流水线通常被分为 前端流水线(Frontend Pipeline) 和 后端流水线(Backend Pi…...
Symbian(塞班)操作系统
Symbian(塞班)是由多家通信巨头联合开发的专为移动设备设计的操作系统,曾是全球智能手机市场的早期主导者。以下是其核心定义与技术特点的整合分析: 一、定义与起源 系统定位 Symbian是由英国Psion公司的EPOC操作系统演变而来…...
CSS -属性值的计算过程
目录 一、抛出两个问题1.如果我们学过优先级关系,那么请思考如下样式为何会生效2.如果我们学习过继承,那么可以知道color是可以被子元素继承使用的,那么请思考下述情景为何不生效 二、属性值计算过程1.确定声明值2.层叠冲突3.使用继承4.使用默…...
施磊老师c++(七)
STL组件 文章目录 STL组件1.整体学习内容2.vector容器3.deque和listdeque--双端队列容器list--链表容器 4.vector,deque,list对比主要内容面经问题 5.详解容器适配器--stack, queue, priority_queue容器适配器stack-栈queue-队列priority_queue-优先级队列总结 6.无序关联容器关…...
Codeforces 158B. Taxi
题目 题目链接:https://codeforces.com/problemset/problem/158/B time limit per test:3 seconds;memory limit per test:256 megabytes After the lessons n groups of schoolchildren went outside and decided to visit Polycarpus to celebrate his birthda…...
hadoop伪分布式搭建--启动过程中如果发现某个datanode出现问题,如何处理?
一、问题定位: (1)检查DataNode日志: DataNode日志通常位于$HADOOP_HOME/logs/或/var/log/hadoop-hdfs/目录下,文件名为hadoop-hdfs-datanode-<hostname>.log。重点关注以下错误类型: ——Incompa…...
MySQL(事物上)
目录 示例: 一 引入事物 1. 概念 2. 事物的4大特性 3. 为什么要有事物? 二 事物操作 1. 查看存储引擎支持的事物 2. 事物的提交方式 2.1 查看事物的默认提交方式 2.2 设置事物的默认提交方式 2.3 查看事物的全局隔离级别 2.4 验证事物的回滚…...
人工智能 Day06 pandas库进阶
1.处理缺失数据 总体流程是这样的, 归根在于如何处理NAN,接下来详细赘述 1.1. 处理缺失值的相关函数 判断缺失值 pd.isnull(df):用于判断 DataFrame df 中的元素是否为缺失值(NaN ),返回一个与df 形状相同…...
C# --- LINQ
C# --- LINQ 什么是LINQFluent Syntax 和 SQL-Like QueryLINQ Operations 什么是LINQ LINQ的全称为Language Integrated Query, 为各种查询(包括对象查询,数据库查询,XML查询) 提供了统一模型.LINQ源于SQL,但比SQL更加强大,更加灵…...
C语言之 条件编译和预处理指令
条件编译 在编译⼀个程序的时候我们如果要将⼀条语句(⼀组语句)编译或者放弃是很⽅便的。因为我们有条件编译指令。 ⽐如说: 调试性的代码删除可惜,保留⼜碍事,所以我们可以选择性的编译。 #define M 1 int main() …...
JVM常用概念之锁省略
问题 synchronized(同步-重量级锁)会解除所有编译器优化吗? 基础知识 使用当前的 Java 内存模型,未观察到的锁不一定会产生任何内存效应。除其他情况外,这意味着对非共享对象进行同步是徒劳的,因此运行时不必在那里做任何事情。这给编译优…...
[网络][tcp协议]:tcp报头
tcp(传输控制协议)是一种面向字节流的传输层协议,相较于udp协议,tcp能保证传输数据的可靠性与准确性,tcp也是目前最常见的传输层协议 本文主要介绍tcp报头各个字段的含义与用途 注:保留6位和6位标记位是目前最普遍的写法,在我查资料时,发现有一些拓展情况,会在后文细说 最简单的…...
传输层自学
传输实体:完成传输层任务的硬件或软件 可能位于: 操作系统内核独立的用户进程绑定在网络应用中的链接库网络接口卡 1.功能: 网络层与传输层作用范围比较? 网络层负责把数据从源机送达到目的机 传输层负责把数据送达到具体的应…...
FFmpeg —— 各系统下ffmpeg硬件加速和API支持情况(文内表格形式详细阐述)
介绍 FFmpeg 作为一款功能强大的多媒体处理工具,支持多种硬件加速技术,能够显著提升视频编解码的效率,尤其是在处理高分辨率、高码率视频时表现尤为突出。不同操作系统下,FFmpeg 的硬件加速实现方式和支持的 API 各有特点。 在 Windows 系统上,FFmpeg 主要依赖 DirectX Vi…...
RUOYI框架在实际项目中的应用二:Ruoyi前后端分离版本
如需观看Ruoyi框架的整体介绍,请移步:RUOYI框架在实际项目中的应用一:ruoyi简介 一、Ruoyi前后端分离版本-RuoYi-Vue 1、官方资料 1:代码地址:https://gitee.com/y_project/RuoYi-Vue.git 2:文档介绍地址…...
2.12[A]distribute sys
在分布式训练中,特别是使用3D并行(数据并行、流水线并行和模型并行)时,不同阶段的GPU可能因为通信或数据依赖而出现空闲时间,这些空闲时间就是所谓的“气泡”。这些气泡会降低整体的训练效率,导致GPU资源的…...
R语言的移动应用开发
R语言的移动应用开发 在数据科学和统计分析的大潮中,R语言因其强大的数据处理和可视化能力而备受青睐。然而,R语言对移动应用开发的适用性并未得到广泛关注。本文将探讨R语言在移动应用开发中的潜力及其工具,并提供一些实践示例,…...
解决 Redis 后台持久化失败的问题:内存不足导致 fork 失败
文章目录 解决 Redis 后台持久化失败的问题:内存不足导致 fork 失败问题背景与成因解决方案修改内核参数 vm.overcommit_memory增加系统内存或 Swap 空间调整 Redis 配置 stop-writes-on-bgsave-error 在 Docker 环境中的注意事项总结 解决 Redis 后台持久化失败的问…...
交换机控制软件的实现步骤猜测
一、主要目的 提出对交换机软件控制逻辑的猜测。 二、交换机控制软件的组成 (一)背景 1、交换机有很多的RJ45水晶头端口。 2、每个端口支持同时发送和接收字节数据。 3、每个端口接收的数据需要查表后才能转发给目标端口。 (二)端口状态扫描线程 负责扫描每个端口的状态&#x…...
100.HarmonyOS NEXT跑马灯组件教程:实际应用与场景示例
温馨提示:本篇博客的详细代码已发布到 git : https://gitcode.com/nutpi/HarmonyosNext 可以下载运行哦! HarmonyOS NEXT跑马灯组件教程:实际应用与场景示例 文章目录 HarmonyOS NEXT跑马灯组件教程:实际应用与场景示例1. 跑马灯组…...
【计算机网络】2物理层
物理层任务:实现相邻节点之间比特(或)的传输 1.通信基础 1.1.基本概念 1.1.1.信源,信宿,信道,数据,信号 数据通信系统主要划分为信源、信道、信宿三部分。 信源:产生和发送数据的源头。 信宿:接收数据的终点。 信道:信号的传输介质。 数据和信号都有模拟或数字…...
2.3 滑动窗口专题:最大连续1的个数 III(LeetCode 1004)
1. 题目链接 1004. 最大连续1的个数 III - 力扣(LeetCode)https://leetcode.cn/problems/max-consecutive-ones-iii/ 2. 题目描述 给定一个二进制数组 nums 和一个整数 k,允许将最多 k 个 0 翻转为 1,求翻转后最长的连续 1 …...
怎么解决在Mac上每次打开文件夹都会弹出一个新窗口的问题
在Mac上每次打开文件夹都会弹出一个新窗口的问题,可以通过以下方法解决 调整Finder设置: 打开Finder,点击“Finder”菜单,选择“偏好设置”。在偏好设置中,选择“通用”标签。取消勾选“在标签页中打开文件夹”或…...
Python异常处理
异常处理 概述 在Python中,在处理可能会引发异常的代码块时,使用try和except语句。可以帮助我们捕获并处理异常, 而不是让程序因为一个未处理的异常而完全崩溃。 try-except try-except-finally try-finally try-except-else try-except-…...
VSTO(C#)Excel开发8:打包发布安装卸载
初级代码游戏的专栏介绍与文章目录-CSDN博客 我的github:codetoys,所有代码都将会位于ctfc库中。已经放入库中我会指出在库中的位置。 这些代码大部分以Linux为目标但部分代码是纯C的,可以在任何平台上使用。 源码指引:github源…...
ImportError: cannot import name ‘genai‘ from ‘google‘ (unknown location) 问题如何处理
这个错误通常发生在没有正确安装Google的生成式AI库。需要安装官方的google-generativeai库: pip install google-generativeai如果代码中使用的导入方式与新版SDK不兼容,可能需要调整导入语句。根据当前代码上下文,正确的导入方式应该是&am…...
Advanced Intelligent Systems 软体机器手助力截肢者玩转鼠标
随着科技的不断进步,假肢技术在改善截肢者生活质量方面取得了显著成就。然而,截肢群体在就业方面仍面临巨大困难,适龄截肢群体的就业率仅为健全群体的一半。现有的肌电控制假肢手在与计算机交互时存在诸多挑战,特别是截肢者在使用…...
kubernetes对于一个nginx服务的增删改查
1、创建 Nginx 服务 1.1、创建 Deployment Deployment 用于管理 Pod 副本和更新策略。 方式一:命令式创建 kubectl create deployment nginx-deployment --imagenginx:latest --replicas3 --port80--replicas3:指定副本数为 3 --port80:容…...
我的世界1.20.1forge模组进阶开发教程生物篇(1)——生成
生物生成 生物生成Alexmob介绍:**1. 核心功能与技术实现****2. 项目结构与代码质量****3. 社区协作与维护****4. 扩展性与开发挑战****5. 开发者学习价值**食蚁兽一、实体属性与行为控制(`EntityAnteater`类)二、实体注册与生成规则(`AMEntityRegistry`类)三、全局生成逻辑…...
1.5 Spring Boot项目打包和运行
本文介绍了如何使用Spring Boot进行项目打包和运行。首先,讲解了如何将Spring Boot项目打包为可执行的JAR包,并直接运行,无需部署到外部Web服务器。接着,介绍了如何将项目打包为WAR包,以便部署到Web容器中,…...
287. 寻找重复数
由于题目规定数组中的数的范围是1-n,因此可以构造出下标n和值nums[n]的映射f(n),然后构成一个链表,当有重复数字时,链表存在环,找到重复数字即找到链表环的入口,参考142. 环形链表II。 class Solution {pu…...
如何高效解决 Java 内存泄漏问题方法论
目录 一、系统化的诊断与优化方法论 二、获取内存快照:内存泄漏的第一步 (一)自动生成 Heap Dump (二)手动生成 Heap Dump 三、导入分析工具:MAT 和 JProfiler (一)MAT (Memor…...
【Agent】OpenManus 项目架构分析
这是我录制的一个视频,主要是描述我理解的 OpenManus 的思维逻辑,通过这个小的思维逻辑的复现,为后面要再分析其他 Agent 的实现做一个准备。 1. 项目概述 OpenManus 是一个基于大语言模型的智能体框架,旨在提供一个无需邀请码的…...
hive-进阶版-1
第6章 hive内部表与外部表的区别 Hive 是一个基于 Hadoop 的数据仓库工具,用于对大规模数据集进行数据存储、查询和分析。Hive 支持内部表(Managed Table)和外部表(External Table)两种表类型,它们在数据…...
规模效应的三重边界:大白话解读-deepseek为例
前言:当Scaling Laws遇见边际递减效应 在人工智能的狂飙突进中,大语言模型如同不断膨胀的星体,吞噬着海量算力与数据。OpenAI于2020年揭开的Scaling Laws,曾为这场盛宴指明方向:模型性能随参数规模(N&…...
考研系列-408真题计算机网络篇(18-23)
写在前面 此文章是本人在备考过程中408真题计算机网络部分(2018年-2023年)的易错题及相应的知识点整理,后期复习也常常用到,对于知识提炼归纳理解起到了很大的作用,分享出来希望帮助到大家~ # 2018 1.停止-等待协议的…...
windows协议不再续签,华为再无windows可用,将于四月发布鸿蒙PC
大家好,我是国货系创始人张云泽,最近不少小伙伴在后台问:“听说Windows协议要到期了?我的电脑会不会变砖?”还有人说:“华为笔记本以后用不了Windows了?鸿蒙系统能用吗?”今天咱们就…...
【二分算法】-- 点名
文章目录 1. 题目2. 题目解析3. 代码 1. 题目 在线oj 2. 题目解析 前四种解决方法: 哈希表直接遍历找结果位运算数学(高斯求和公式) 这四种方法的时间复杂度都是0(N) 第五种解决方法: 【二段性】&…...
强化学习 - PPO控制无人机
PPO(Proximal Policy Optimization,近端策略优化)是一种强化学习算法,用于训练智能体(无人机)如何在环境中做出决策。它本质上是 策略梯度(Policy Gradient)方法 的一种改进…...
【AHE数据集】 NCAR Anthropogenic Heat Flux (AHF) 数据集
数据概述 数据集由 美国国家大气研究中心(NCAR, National Center for Atmospheric Research) 的 气候与全球动力学实验室(CGD, Climate & Global Dynamics Laboratory) 提供。NCAR 由 美国国家科学基金会(NSF, National Science Foundation) 资助,并由 大学大气研究…...
Part1:基于国内源完成Kubernetes集群部署
集群规划 操作系统:CentOS7 内核版本:5.4(需升级) 组件版本说明操作系统内核5.4RPM方式升级docker26.1.4yum安装cri-docker0.3.16二进制安装kubeadm1.30.11yum安装kubealet1.30.11yum安装kubectl1.30.11yum安装kubectl1.30.11yu…...
强化学习的一些概念
目录 强化学习 打个比方 核心要素 State Action Reward 几个代码demo 学习目标 强化学习 强化学习(Reinforcement Learning, RL)是机器学习的一个分支,旨在让智能体(Agent)通过与环境的交互学习最优策略,以…...
花生好车:重构汽车新零售生态的破局者
在传统汽车零售行业面临消费升级与渠道变革的双重压力下,花生好车以颠覆性的商业模式在短短九年内崛起为行业独角兽。这家成立于2015年的汽车新零售平台,通过重构供应链体系、创新融资租赁模式、深耕下沉市场三大战略维度,正在重塑中国汽车消…...
K8S下nodelocaldns crash问题导致域名请求响应缓慢
前言 最近做项目,有业务出现偶发的部署导致响应很慢的情况,据了解,业务使用域名访问,相同的nginx代理,唯一的区别就是K8S重新部署了。那么问题大概率出现在容器平台,毕竟业务是重启几次正常,偶…...
实现悬浮按钮拖动,兼容h5和微信小程序
h5用js写,微信小程序用 代码里面没有完全实现吸附边缘的功能,需要吸附边缘的话还得自己再完善下(h5的吸附边缘是可以的,小程序的还有点问题) 主要功能是:图片上写文字的悬浮按钮,文字使用的是…...
SLC跨头协作机制
SLC跨头协作机制 SLC(Self-attention with Local Communication,或类似跨头协作机制)在Transformer架构中通过以下逻辑帮助注意力头优化分布: 1. 多头注意力的「独立-协作」平衡 传统多头注意力中,每个头独立计算注意力(如Query/Key/Value的线性变换),捕捉不同语义模…...
全国医院数据可视化分析系统
【大数据】全国医院数据可视化分析系统 (完整系统源码开发笔记详细部署教程)✅ 目录 一、项目简介二、项目界面展示三、项目视频展示 一、项目简介 🏥 项目名:医疗导航神器!——《基于大数据的微医挂号网医院数据可视…...
Flash Attention原理讲解
目录 前言0. 简述1. self-attention2. roofline model3. 矩阵分块4. softmax分块5. FlashAttention结语参考 前言 看了几个视频和几篇文章学习了下 Flash Attention,记录下个人学习笔记,仅供自己参考😄 refer1:Flash Attention 为…...