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

06.three官方示例+编辑器+AI快速学习webgl_animation_skinning_additive_blending

news 来源：原创 2025/7/27 11:31:25

本实例主要讲解内容

这个Three.js示例展示了**骨骼动画(Skinning)和变形动画(Morphing)**的结合应用。通过加载一个机器人模型，演示了如何同时控制角色的肢体动作和面部表情，实现更加丰富的角色动画效果。

核心技术包括：

  • 多动画混合与淡入淡出
  • 基础动画状态与一次性动作的切换
  • 面部变形目标(Morph Targets)控制
  • 动画事件监听与状态恢复
    在这里插入图片描述

完整代码注释

<!DOCTYPE html>
<html lang="en"><head><title>three.js webgl - skinning and morphing</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"><link type="text/css" rel="stylesheet" href="main.css"><style>body {color: #222;}a {color: #2fa1d6;}p {max-width: 600px;margin-left: auto;margin-right: auto;padding: 0 2em;}</style></head><body><div id="info"><a href="https://threejs.org" target="_blank" rel="noopener">three.js</a> webgl - skinning and morphing<br /><p>The animation system allows clips to be played individually, looped, or crossfaded with other clips. This example shows a character looping in one of several base animation states, then transitioning smoothly to one-time actions. Facial expressions are controlled independently with morph targets.</p>Model by<a href="https://www.patreon.com/quaternius" target="_blank" rel="noopener">Tomás Laulhé</a>,modifications by <a href="https://donmccurdy.com/" target="_blank" rel="noopener">Don McCurdy</a>. CC0.<br /></div><script type="importmap">{"imports": {"three": "../build/three.module.js","three/addons/": "./jsm/"}}</script><script type="module">import * as THREE from 'three';import Stats from 'three/addons/libs/stats.module.js';import { GUI } from 'three/addons/libs/lil-gui.module.min.js';import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';let container, stats, clock, gui, mixer, actions, activeAction, previousAction;let camera, scene, renderer, model, face;const api = { state: 'Walking' };init();function init() {container = document.createElement( 'div' );document.body.appendChild( container );camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.25, 100 );camera.position.set( - 5, 3, 10 );camera.lookAt( 0, 2, 0 );scene = new THREE.Scene();scene.background = new THREE.Color( 0xe0e0e0 );scene.fog = new THREE.Fog( 0xe0e0e0, 20, 100 );clock = new THREE.Clock();// lightsconst hemiLight = new THREE.HemisphereLight( 0xffffff, 0x8d8d8d, 3 );hemiLight.position.set( 0, 20, 0 );scene.add( hemiLight );const dirLight = new THREE.DirectionalLight( 0xffffff, 3 );dirLight.position.set( 0, 20, 10 );scene.add( dirLight );// groundconst mesh = new THREE.Mesh( new THREE.PlaneGeometry( 2000, 2000 ), new THREE.MeshPhongMaterial( { color: 0xcbcbcb, depthWrite: false } ) );mesh.rotation.x = - Math.PI / 2;scene.add( mesh );const grid = new THREE.GridHelper( 200, 40, 0x000000, 0x000000 );grid.material.opacity = 0.2;grid.material.transparent = true;scene.add( grid );// modelconst loader = new GLTFLoader();loader.load( 'models/gltf/RobotExpressive/RobotExpressive.glb', function ( gltf ) {model = gltf.scene;scene.add( model );createGUI( model, gltf.animations );}, undefined, function ( e ) {console.error( e );} );renderer = new THREE.WebGLRenderer( { antialias: true } );renderer.setPixelRatio( window.devicePixelRatio );renderer.setSize( window.innerWidth, window.innerHeight );renderer.setAnimationLoop( animate );container.appendChild( renderer.domElement );window.addEventListener( 'resize', onWindowResize );// statsstats = new Stats();container.appendChild( stats.dom );}function createGUI( model, animations ) {// 定义不同类型的动画状态const states = [ 'Idle', 'Walking', 'Running', 'Dance', 'Death', 'Sitting', 'Standing' ];const emotes = [ 'Jump', 'Yes', 'No', 'Wave', 'Punch', 'ThumbsUp' ];gui = new GUI();mixer = new THREE.AnimationMixer( model ); // 创建动画混合器actions = {};// 初始化所有动画动作for ( let i = 0; i < animations.length; i ++ ) {const clip = animations[ i ];const action = mixer.clipAction( clip );actions[ clip.name ] = action;// 设置一次性动画的属性if ( emotes.indexOf( clip.name ) >= 0 || states.indexOf( clip.name ) >= 4 ) {action.clampWhenFinished = true; // 动画结束后保持最后一帧action.loop = THREE.LoopOnce; // 只播放一次}}// 创建状态控制面板const statesFolder = gui.addFolder( 'States' );// 添加状态选择下拉菜单const clipCtrl = statesFolder.add( api, 'state' ).options( states );// 状态变化时的回调函数clipCtrl.onChange( function () {fadeToAction( api.state, 0.5 ); // 淡入淡出到新状态} );statesFolder.open();// 创建表情控制面板const emoteFolder = gui.addFolder( 'Emotes' );// 为每个表情创建回调函数function createEmoteCallback( name ) {api[ name ] = function () {fadeToAction( name, 0.2 ); // 淡入表情动画// 添加动画完成事件监听，完成后恢复基础状态mixer.addEventListener( 'finished', restoreState );};emoteFolder.add( api, name );}// 恢复基础状态的函数function restoreState() {mixer.removeEventListener( 'finished', restoreState );fadeToAction( api.state, 0.2 );}// 为每个表情创建控制面板项for ( let i = 0; i < emotes.length; i ++ ) {createEmoteCallback( emotes[ i ] );}emoteFolder.open();// 面部表情控制face = model.getObjectByName( 'Head_4' );// 获取所有面部变形目标const expressions = Object.keys( face.morphTargetDictionary );const expressionFolder = gui.addFolder( 'Expressions' );// 为每个面部表情创建滑块控制for ( let i = 0; i < expressions.length; i ++ ) {expressionFolder.add( face.morphTargetInfluences, i, 0, 1, 0.01 ).name( expressions[ i ] );}// 设置初始活动动画activeAction = actions[ 'Walking' ];activeAction.play();expressionFolder.open();}// 动画淡入淡出函数function fadeToAction( name, duration ) {previousAction = activeAction;activeAction = actions[ name ];if ( previousAction !== activeAction ) {previousAction.fadeOut( duration ); // 淡出当前动画}// 重置并播放新动画activeAction.reset().setEffectiveTimeScale( 1 ).setEffectiveWeight( 1 ).fadeIn( duration ).play();}// 窗口大小变化处理函数function onWindowResize() {camera.aspect = window.innerWidth / window.innerHeight;camera.updateProjectionMatrix();renderer.setSize( window.innerWidth, window.innerHeight );}// 动画循环函数function animate() {const dt = clock.getDelta();if ( mixer ) mixer.update( dt ); // 更新动画混合器renderer.render( scene, camera ); // 渲染场景stats.update(); // 更新性能统计}</script></body>
</html>

骨骼动画与变形动画详解

骨骼动画(Skinning)

骨骼动画是通过建立骨骼层级结构并绑定到网格顶点来实现的动画技术。主要特点：

  1. 骨骼层级：骨骼按照父子关系组织成树状结构
  2. 蒙皮权重：每个顶点关联到一个或多个骨骼，并有权重值决定受骨骼影响的程度
  3. 正向运动学：父骨骼的运动会影响子骨骼
  4. 反向运动学：通过设定末端骨骼位置，计算整个骨骼链的姿态

在本示例中，机器人的肢体动作（如行走、跑步、跳舞）就是通过骨骼动画实现的。

变形动画(Morphing)

变形动画（也称为顶点动画）是通过直接修改网格顶点位置来实现的动画技术。主要特点：

  1. 基础网格：定义模型的默认形状
  2. 变形目标：定义从基础网格到目标形状的顶点偏移
  3. 影响权重：控制每个变形目标对最终形状的影响程度
  4. 多目标混合：可以同时应用多个变形目标并调整权重

在本示例中，机器人的面部表情（如微笑、惊讶、生气）就是通过变形动画实现的。

动画混合与状态管理

Three.js提供了强大的动画混合系统，可以实现：

  1. 动画淡入淡出：通过fadeIn()和fadeOut()方法实现平滑过渡
  2. 动画权重控制：调整多个动画的混合比例
  3. 动画状态管理：组织不同的动画状态并管理它们之间的转换
  4. 动画事件监听：监听动画开始、结束等事件

在本示例中，我们可以看到：

  • 基础状态（如行走、跑步）是循环播放的
  • 表情动画（如跳跃、挥手）是一次性的，播放后会自动恢复到基础状态
  • 面部表情可以独立于肢体动作进行控制
实际应用场景

骨骼动画和变形动画结合的技术在以下场景中特别有用：

  1. 游戏角色动画：控制角色的移动、战斗和表情
  2. 虚拟主播：实时捕捉面部表情和肢体动作
  3. 动画制作：简化复杂角色动画的制作流程
  4. 虚拟现实：创建更加生动和交互性强的虚拟角色

这种技术组合可以让角色表现更加丰富和自然，大大提升用户体验。

相关文章：

06.three官方示例+编辑器+AI快速学习webgl_animation_skinning_additive_blending

本实例主要讲解内容 这个Three.js示例展示了**骨骼动画(Skinning)和变形动画(Morphing)**的结合应用。通过加载一个机器人模型&#xff0c;演示了如何同时控制角色的肢体动作和面部表情&#xff0c;实现更加丰富的角色动画效果。 核心技术包括&#xff1a; 多动画混合与淡入…...

编程日记 2025/7/27 11:31:25

【Java学习日记36】:javabeen学生系统

ideal快捷键...

编程日记 2025/7/27 6:41:12

.Net HttpClient 使用请求数据

HttpClient 使用请求数据 0、初始化及全局设置 //初始化&#xff1a;必须先执行一次 #!import ./ini.ipynb1、使用url 传参 参数放在Url里&#xff0c;形如&#xff1a;http://www.baidu.com?namezhangsan&age18, GET、Head请求用的比较多。优点是简单、方便&#xff0…...

编程日记 2025/7/27 15:53:58

详解 Java 并发编程 synchronized 关键字

synchronized 关键字的作用 synchronized 是 Java 中用于实现线程同步的关键字&#xff0c;主要用于解决多线程环境下的资源竞争问题。它可以修饰方法或代码块&#xff0c;确保同一时间只有一个线程可以执行被修饰的代码&#xff0c;从而避免数据不一致的问题。 synchronized…...

编程日记 2025/7/27 16:51:39

《Go小技巧易错点100例》第三十二篇

本期分享&#xff1a; 1.sync.Map的原理和使用方式 2.实现有序的Map sync.Map的原理和使用方式 sync.Map的底层结构是通过读写分离和无锁读设计实现高并发安全&#xff1a; 1&#xff09;双存储结构&#xff1a; 包含原子化的 read&#xff08;只读缓存&#xff0c;无锁快…...

编程日记 2025/7/25 18:03:52

时序约束高级进阶使用详解四：Set_False_Path

目录 一、背景 二、Set_False_Path 2.1 Set_false_path常用场景 2.2 Set_false_path的优势 2.3 Set_false_path设置项 2.4 细节区分 三、工程示例 3.1 工程代码 3.2 时序约束如下 3.3 时序报告 3.4 常规场景 3.4.1 设计代码 3.4.2 约束场景 3.4.3 约束对象总结…...

编程日记 2025/7/25 8:40:43

每日定投40刀BTC（16）20250428 - 20250511

定投 坚持 《恒道》 长河九曲本微流&#xff0c;岱岳摩云起累丘。 铁杵十年销作刃&#xff0c;寒窗五鼓淬成钩。已谙蜀栈盘空险&#xff0c;更蓄湘竹带泪遒。 莫问枯荣何日证&#xff0c;星霜满鬓亦从头。...

编程日记 2025/7/2 16:17:47

C# 高效处理海量数据：解决嵌套并行的性能陷阱

C# 高效处理海量数据&#xff1a;解决嵌套并行的性能陷阱 问题场景 假设我们需要在 10万条ID 和 1万个目录路径 中&#xff0c;快速找到所有满足以下条件的路径&#xff1a; 路径本身包含ID字符串该路径的子目录中也包含同名ID 初始代码采用Parallel.ForEach嵌套Task.Run&am…...

编程日记 2025/7/24 21:36:30

【Java EE初阶 --- 多线程（初阶）】线程安全问题

乐观学习&#xff0c;乐观生活&#xff0c;才能不断前进啊&#xff01;&#xff01;&#xff01; 我的主页&#xff1a;optimistic_chen 我的专栏&#xff1a;c语言 &#xff0c;Java 欢迎大家访问~ 创作不易&#xff0c;大佬们点赞鼓励下吧~ 文章目录 线程不安全的原因根本原因…...

编程日记 2025/7/24 18:03:30

从InfluxDB到StarRocks：Grab实现Spark监控平台10倍性能提升

Grab 是东南亚领先的超级应用&#xff0c;业务涵盖外卖配送、出行服务和数字金融&#xff0c;覆盖东南亚八个国家的 800 多个城市&#xff0c;每天为数百万用户提供一站式服务&#xff0c;包括点餐、购物、寄送包裹、打车、在线支付等。 为了优化 Spark 监控性能&#xff0c;Gr…...

编程日记 2025/7/24 11:22:03

《Redis应用实例》学习笔记，第一章：缓存文本数据

前言 最近在学习《Redis应用实例》&#xff0c;这本书并没有讲任何底层&#xff0c;而是聚焦实战用法&#xff0c;梳理了 32 种 Redis 的常见用法。我的笔记在 Github 上&#xff0c;用 Jupyter 记录&#xff0c;会有更好的阅读体验&#xff0c;作者的源码在这里&#xff1a;h…...

编程日记 2025/7/27 7:57:20

Redis 缓存

缓存介绍 Redis 最主要三个用途&#xff1a; 1&#xff09;存储数据&#xff08;内存数据库&#xff09; 2&#xff09;消息队列 3&#xff09;缓存 对于硬件的访问速度&#xff0c;通常有以下情况&#xff1a; CPU 寄存器 > 内存 > 硬盘 > 网络 缓存的核心…...

编程日记 2025/7/27 4:52:23

Apache Flink 与 Flink CDC：概念、联系、区别及版本演进解析

Apache Flink 与 Flink CDC：概念、联系、区别及版本演进解析 在实时数据处理和流式计算领域，Apache Flink 已成为行业标杆。而 Flink CDC（Change Data Capture） 作为其生态中的重要组件，为数据库的实时变更捕获提供了强大的能力。 本文将从以下几个方面进行深入讲解： 什…...

编程日记 2025/7/23 4:43:30

缓存（4）：常见缓存 概念、问题、现象 及 预防问题

常见缓存概念 缓存特征: 命中率、最大元素、清空策略 命中率&#xff1a;命中率返回正确结果数/请求缓存次数 它是衡量缓存有效性的重要指标。命中率越高&#xff0c;表明缓存的使用率越高。 最大元素&#xff08;最大空间&#xff09;&#xff1a;缓存中可以存放的最大元素的…...

编程日记 2025/7/24 15:04:43

实战项目6（09）

目录 任务场景一 【r1配置】 【r2配置】 【r3配置】 ​​​​​​​任务场景二 【r1配置】 【r2配置】 【r3配置】 ​​​​​​​任务场景三 【r1配置】 【r2配置】 【r3配置】 ​​​​​​​任务场景一 按照下图完成网络拓扑搭建和配置 任务要求&#xff1a;在…...

编程日记 2025/7/24 13:16:22

MySQL 数据库故障排查指南

MySQL 数据库故障排查指南 本指南旨在帮助您识别和解决常见的 MySQL 数据库故障。我们将从问题识别开始&#xff0c;逐步深入到具体的故障类型和排查步骤。 1. 问题识别与信息收集 在开始排查之前&#xff0c;首先需要清晰地了解问题的现象和范围。 故障现象&#xff1a; 数…...

编程日记 2025/7/26 11:57:46

MacOS Python3安装

python一般在Mac上会自带&#xff0c;但是大多都是python2。 python2和python3并不存在上下版本兼容的情况&#xff0c;所以python2和python3可以同时安装在一台设备上&#xff0c;并且python3的一些语法和python2并不互通。 所以在Mac电脑上即使有自带python&#xff0c;想要使…...

编程日记 2025/7/23 14:44:09

锁相放大技术：从噪声中提取微弱信号的利器

锁相放大技术&#xff1a;从噪声中提取微弱信号的利器 一、什么是锁相放大&#xff1f; 锁相放大&#xff08;Lock-in Amplification&#xff09;是一种用于检测微弱信号的技术&#xff0c;它能够从强噪声背景中提取出我们感兴趣的特定信号。想象一下在嘈杂的派对上听清某个人…...

编程日记 2025/7/23 17:01:38

机器学习总结

1.BN【batch normalization】 https://zhuanlan.zhihu.com/p/93643523 减少 2.L1L2正则化 l1:稀疏 l2:权重减小 3.泛化误差 训练误差计算了训练集的误差&#xff0c;而泛化误差是计算全集的误差。 4.dropout 训练过程中神经元p的概率失活 一文彻底搞懂深度学习&#x…...

编程日记 2025/7/24 16:10:38

基于神经网络的无源雷达测向系统仿真实现

基于神经网络的无源雷达测向系统仿真实现 项目概述 本项目实现了基于卷积神经网络(CNN)的无源雷达方向到达角(DOA)估计系统。通过深度学习方法&#xff0c;系统能够从接收到的雷达信号中准确估计出信号源的方向&#xff0c;适用于单目标和多目标场景。相比传统的DOA估计算法&…...

编程日记 2025/7/25 0:36:41

《用MATLAB玩转游戏开发》Flappy Bird：小鸟飞行大战MATLAB趣味实现

《用MATLAB玩转游戏开发&#xff1a;从零开始打造你的数字乐园》基础篇&#xff08;2D图形交互&#xff09;-Flappy Bird&#xff1a;小鸟飞行大战MATLAB趣味实现 文章目录 《用MATLAB玩转游戏开发&#xff1a;从零开始打造你的数字乐园》基础篇&#xff08;2D图形交互&#xf…...

编程日记 2025/7/26 8:37:31

【C/C++】跟我一起学_C++同步机制效率对比与优化策略

文章目录 C同步机制效率对比与优化策略1 效率对比2 核心同步机制详解与适用场景3 性能优化建议4 场景对比表5 总结 C同步机制效率对比与优化策略 多线程编程中&#xff0c;同步机制的选择直接影响程序性能与资源利用率。 主流同步方式: 互斥锁原子操作读写锁条件变量无锁数据…...

编程日记 2025/7/21 21:57:33

linux 三剑客命令学习

grep Grep 是一个命令行工具&#xff0c;用于在文本文件中搜索打印匹配指定模式的行。它的名称来自于 “Global Regular Expression Print”&#xff08;全局正则表达式打印&#xff09;&#xff0c;它最初是由 Unix 系统上的一种工具实现的。Grep 工具在 Linux 和其他类 Unix…...

编程日记 2025/7/24 4:03:27

【js基础笔记] - 包含es6 类的使用

文章目录 js基础js 预解析js变量提升 DOM相关知识节点选择器获取属性节点创建节点插入节点替换节点克隆节点获取节点属性获取元素尺寸获取元素偏移量标准的dom事件流阻止事件传播阻止默认行为事件委托 正则表达式js复杂类型元字符 - 基本元字符元字符 - 边界符元字符 - 限定符元…...

编程日记 2025/7/20 17:50:25

《Linux命令行大全（第2版）》PDF下载

内容简介 本书对Linux命令行进行详细的介绍&#xff0c;全书内容包括4个部分&#xff0c;第一部分由Shell的介绍开启命令行基础知识的学习之旅&#xff1b;第二部分讲述配置文件的编辑&#xff0c;如何通过命令行控制计算机&#xff1b;第三部分探讨常见的任务与必备工具&…...

编程日记 2025/7/27 8:55:48

补补表面粗糙度的相关知识（一）

表面粗糙度&#xff0c;或简称粗糙度&#xff0c;是指表面不光滑的特性。这个在机械加工行业内可以说是绝绝的必备知识之一&#xff0c;但往往也是最容易被忽略的&#xff0c;因为往往天天接触的反而不怎么关心&#xff0c;或者没有真正的去认真学习掌握。对于像我一样&#xf…...

编程日记 2025/7/25 1:22:46

Python实用工具：pdf转doc

该工具只能使用在英文目录下&#xff0c;且无法转换出图片&#xff0c;以及文本特殊格式。 下载依赖项 pip install PyPDF2 升级依赖项 pip install PyPDF2 --upgrade 查看库版本 python -c "import PyPDF2; print(PyPDF2.__version__)" 下载第二个依赖项 pip i…...

编程日记 2025/7/26 18:53:13

基于Dify实现对Excel的数据分析

在dify部署完成后&#xff0c;大家就可以基于此进行各种应用场景建设&#xff0c;目前dify支持聊天助手&#xff08;包括对话工作流&#xff09;、工作流、agent等模式的场景建设&#xff0c;我们在日常工作中经常会遇到各种各样的数据清洗、格式转换处理、数据统计成图等数据分…...

编程日记 2025/7/23 21:54:07

Win全兼容！五五 Excel Word 转 PDF 工具解决多场景转换难题

各位办公小能手们&#xff01;今天给你们介绍一款超牛的工具——五五Excel Word批量转PDF工具V5.5版。这玩意儿专注搞批量格式转换&#xff0c;能把Excel&#xff08;.xls/.xlsx&#xff09;和Word&#xff08;.doc/.docx&#xff09;文档唰唰地变成PDF格式。 先说说它的核心功…...

编程日记 2025/7/26 20:08:00

java加强 -Collection集合

集合是一种容器&#xff0c;类似于数组&#xff0c;但集合的大小可变&#xff0c;开发中也非常常用。Collection代表单列集合&#xff0c;每个元素&#xff08;数据&#xff09;只包含1个值。Collection集合分为两类&#xff0c;List集合与set集合。 特点 List系列集合&#…...

编程日记 2025/7/22 2:27:58

BGP实验练习1

需求&#xff1a; 要求五台路由器的环回地址均可以相互访问 需求分析&#xff1a; 1.图中存在五个路由器 AR1、AR2、AR3、AR4、AR5&#xff0c;分属不同自治系统&#xff08;AS&#xff09;&#xff0c;AR1 在 AS 100&#xff0c;AR2 - AR4 在 AS 200&#xff0c;AR5 在 AS …...

编程日记 2025/7/27 12:18:06

Nginx location静态文件映射配置

遇到问题&#xff1f; 以下这个Nginx的配置&#xff0c;愿意为访问https://abc.com会指向一个动态网站&#xff0c;访问https://abc.com/tongsongzj时会访问静态网站&#xff0c;但是配置之后&#xff08;注意看后面那个location /tongsongzj/静态文件映射的配置&#xff09;&…...

编程日记 2025/7/22 14:44:39

四、Hive DDL表定义、数据类型、SerDe 与分隔符核心

在理解了 Hive 数据库的基本操作后&#xff0c;本篇笔记将深入到数据存储的核心单元——表 (Table) 的定义和管理。掌握如何创建表、选择合适的数据类型、以及配置数据的读写方式 (特别是 SerDe 和分隔符)&#xff0c;是高效使用 Hive 的关键。 一、创建表 (CREATE TABLE)&…...

编程日记 2025/7/15 21:53:31

每日脚本 5.11 - 进制转换和ascii字符

前置知识 python中各个进制的开头 二进制 &#xff1a; 0b 八进制 &#xff1a; 0o 十六进制 : 0x 进制转换函数 &#xff1a; bin() 转为2进制 oct() 转换为八进制的函数 hex() 转换为16进制的函数 ascii码和字符之间的转换 &#xff1a; chr(97) 码转为字符 …...

编程日记 2025/7/22 10:36:02

cookie和session的区别

一、基本概念 1. Cookie 定义​​&#xff1a;Cookie 是服务器发送到用户浏览器并保存在本地的一小块数据&#xff08;通常小于4KB&#xff09;&#xff0c;浏览器会在后续请求中自动携带该数据。作用​​&#xff1a;用于跟踪用户状态&#xff08;如登录状态&#xff09;、记…...

编程日记 2025/7/24 23:27:17

Kotlin Multiplatform--03：项目实战

Kotlin Multiplatform--03&#xff1a;项目实战 引言配置iOS开发环境配置项目环境运行程序 引言 本章将会带领读者进行项目实战&#xff0c;了解如何从零开始编译一个能同时在Android和iOS运行的App。开发环境一般来说需要使用Macbook&#xff0c;笔者没试过Windows是否能开发。…...

编程日记 2025/7/23 1:25:21

图形学、人机交互、VR/AR领域文献速读【持续更新中...】

&#xff08;1&#xff09;笔者在时间有限的情况下&#xff0c;想要多积累一些自身课题之外的新文献、新知识&#xff0c;所以开了这一篇文章。 &#xff08;2&#xff09;想通过将文献喂给大模型&#xff0c;并向大模型提问的方式来快速理解文献的重要信息&#xff08;如基础i…...

编程日记 2025/7/27 1:31:05

opencascade.js stp vite 调试笔记

Hello, World! | OpenCascade.js cnpm install opencascade.js cnpm install vite-plugin-wasm --save-dev 当你不知道文件写哪的时候trae还是有点用的 ‘’‘ import { defineConfig } from vite; import wasm from vite-plugin-wasm; import rollupWasm from rollup/plugi…...

编程日记 2025/7/22 0:33:27

openharmony系统移植之gpu mesa3d适配

openharmony系统移植之gpu mesa3d适配 文章目录 openharmony系统移植之gpu mesa3d适配1. 环境说明2. gpu内核panfrost驱动2.1 使能panfrost驱动2.2 panfrost dts配置 3. buildroot下测试gpu驱动3.1 buildroot配置编译 4. ohos下mesa3d适配4.1 ohos下mesa3d编译调试4.1.2 编译4.…...

编程日记 2025/7/23 4:26:36

Java开发经验——阿里巴巴编码规范经验总结2

摘要 这篇文章是关于Java开发中阿里巴巴编码规范的经验总结。它强调了避免使用Apache BeanUtils进行属性复制&#xff0c;因为它效率低下且类型转换不安全。推荐使用Spring BeanUtils、Hutool BeanUtil、MapStruct或手动赋值等替代方案。文章还指出不应在视图模板中加入复杂逻…...

编程日记 2025/7/26 4:30:35

Linux中常见开发工具简单介绍

目录 apt/yum 介绍 常用命令 install remove list vim 介绍 常用模式 命令模式 插入模式 批量操作 底行模式 模式替换图 vim的配置文件 gcc/g 介绍 处理过程 预处理 编译 汇编 链接 库 静态库 动态库&#xff08;共享库&#xff09; make/Makefile …...

编程日记 2025/7/24 19:02:27

深入理解深度Q网络DQN：基于python从零实现

DQN是什么玩意儿&#xff1f; 深度Q网络&#xff08;DQN&#xff09;是深度强化学习领域里一个超厉害的算法。它把Q学习和深度神经网络巧妙地结合在了一起&#xff0c;专门用来搞定那些状态空间维度特别高、特别复杂的难题。它展示了用函数近似来学习价值函数的超能力&#xf…...

编程日记 2025/7/27 10:58:33

使用lldb看看Rust的HashMap

目录 前言 正文 读取桶的状态 获取键值对 键值对的指针地址 此时&#xff0c;读取数据 读取索引4的键值对 多添加几个键值对 使用i32作为键&#xff0c;&str作为值 使用i32作为键&#xff0c;String作为值 前言 前面使用ldb看了看不同的类型&#xff0c;这篇再使用…...

编程日记 2025/7/27 9:11:22

Vue3简易版购物车的实现。

文章目录 一、话不多说&#xff0c;直接上代码&#xff1f; 一、话不多说&#xff0c;直接上代码&#xff1f; <template><div><input type"text" placeholder"请输入内容" v-model"keywords"><button click"addGood…...

编程日记 2025/7/23 10:09:04

比亚迪全栈自研生态的底层逻辑

比亚迪全栈自研生态的底层逻辑&#xff1a;汽车工程师必须理解的闭环技术革命 引言&#xff1a;当技术壁垒成为护城河 2023年比亚迪销量突破302万辆的震撼数据背后&#xff0c;隐藏着一个更值得工程师深思的事实&#xff1a;其全栈自研体系覆盖了新能源汽车83%的核心零部件。这…...

编程日记 2025/7/22 23:59:04

[Java实战]Spring Boot 快速配置 HTTPS 并实现 HTTP 自动跳转(八)

[Java实战]Spring Boot 快速配置 HTTPS 并实现 HTTP 自动跳转(八) 引言 在当今网络安全威胁日益严峻的背景下&#xff0c;为 Web 应用启用 HTTPS 已成为基本要求。Spring Boot 提供了简单高效的方式集成 HTTPS 支持&#xff0c;无论是开发环境测试还是生产环境部署&#xff0…...

编程日记 2025/7/25 16:32:50

5.1.1 WPF中Command使用介绍

WPF 的命令系统是一种强大的输入处理机制，它比传统的事件处理更加灵活和可重用，特别适合 MVVM （Model, View, ViewModel)模式开发。 一、命令系统核心概念 1.命令系统基本元素： 命令(Command): 即ICommand类，使用最多的是RoutedCommand，也可以自己继承ICommand使用自定…...

编程日记 2025/7/22 22:30:21

设计模式简述（十九）桥梁模式

桥梁模式 描述基本组件使用 描述 桥梁模式是一种相对简单的模式&#xff0c;通常以组合替代继承的方式实现。 从设计原则来讲&#xff0c;可以说是单一职责的一种体现。 将原本在一个类中的功能&#xff0c;按更细的粒度拆分到不同的类中&#xff0c;然后各自独立发展。 基本…...

编程日记 2025/7/24 20:00:51

常用设计模式

一、什么是设计模式 设计模式&#xff08;Design Pattern&#xff09;是一套被反复使用、多数人知晓的、经过分类编目的代码设计经验总结&#xff0c;旨在解决面向对象设计中反复出现的问题&#xff0c;提升代码的可重用性、可理解性和可靠性。以下从多个维度详细讲解&#xff…...

编程日记 2025/7/18 16:11:40

20242817-李臻-课下作业：Qt和Sqlite

实验内容 阅读附件内容&#xff0c;编译运行附件中第一章&#xff0c;第三章的例子。 实验过程 第一章 t1实践 #include <QApplication> #include <QWidget> #include <QPushButton> #include <QVBoxLayout>int main(int argc, char *argv[]) {QA…...

编程日记 2025/7/26 7:56:55