threejs(7)-精通粒子特效

一、初识Points与点材质

在这里插入图片描述

// 设置点材质
const pointsMaterial = new THREE.PointsMaterial(); 
import * as THREE from "three";
// 导入轨道控制器
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls";
// 导入动画库
import gsap from "gsap";
// 导入dat.gui
import * as dat from "dat.gui";// 目标:认识pointesconst gui = new dat.GUI();
// 1、创建场景
const scene = new THREE.Scene();// 2、创建相机
const camera = new THREE.PerspectiveCamera(75,window.innerWidth / window.innerHeight,0.1,1000
);// 设置相机位置
camera.position.set(0, 0, 10);
scene.add(camera);// 创建球几何体
const sphereGeometry = new THREE.SphereBufferGeometry(3, 30, 30);
delete sphereGeometry.attributes.uv;
// const material = new THREE.MeshBasicMaterial({
//   color: 0xff0000,
//   wireframe: true,
// });
// const mesh = new THREE.Mesh(sphereGeometry, material);
// scene.add(mesh);// 设置点材质
const pointsMaterial = new THREE.PointsMaterial(); 
pointsMaterial.size = 0.1;
pointsMaterial.color.set(0xfff000);
// 相机深度而衰减
pointsMaterial.sizeAttenuation = true;// 载入纹理
const textureLoader = new THREE.TextureLoader();
const texture = textureLoader.load("./textures/particles/2.png");
// 设置点材质纹理
pointsMaterial.map = texture;
pointsMaterial.alphaMap = texture;
pointsMaterial.transparent = true;
pointsMaterial.depthWrite = false;
pointsMaterial.blending = THREE.AdditiveBlending;const points = new THREE.Points(sphereGeometry, pointsMaterial);scene.add(points);// 初始化渲染器
const renderer = new THREE.WebGLRenderer();
// 设置渲染的尺寸大小
renderer.setSize(window.innerWidth, window.innerHeight);
// 开启场景中的阴影贴图
renderer.shadowMap.enabled = true;
renderer.physicallyCorrectLights = true;// console.log(renderer);
// 将webgl渲染的canvas内容添加到body
document.body.appendChild(renderer.domElement);// // 使用渲染器,通过相机将场景渲染进来
// renderer.render(scene, camera);// 创建轨道控制器
const controls = new OrbitControls(camera, renderer.domElement);
// 设置控制器阻尼,让控制器更有真实效果,必须在动画循环里调用.update()。
controls.enableDamping = true;// 添加坐标轴辅助器
const axesHelper = new THREE.AxesHelper(5);
scene.add(axesHelper);
// 设置时钟
const clock = new THREE.Clock();function render() {let time = clock.getElapsedTime();controls.update();renderer.render(scene, camera);//   渲染下一帧的时候就会调用render函数requestAnimationFrame(render);
}render();// 监听画面变化,更新渲染画面
window.addEventListener("resize", () => {//   console.log("画面变化了");// 更新摄像头camera.aspect = window.innerWidth / window.innerHeight;//   更新摄像机的投影矩阵camera.updateProjectionMatrix();//   更新渲染器renderer.setSize(window.innerWidth, window.innerHeight);//   设置渲染器的像素比renderer.setPixelRatio(window.devicePixelRatio);
});

二、深度解析点材质属性

在这里插入图片描述

import * as THREE from "three";
// 导入轨道控制器
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls";
// 导入动画库
import gsap from "gsap";
// 导入dat.gui
import * as dat from "dat.gui";// 目标:认识pointesconst gui = new dat.GUI();
// 1、创建场景
const scene = new THREE.Scene();// 2、创建相机
const camera = new THREE.PerspectiveCamera(75,window.innerWidth / window.innerHeight,0.1,1000
);// 设置相机位置
camera.position.set(0, 0, 10);
scene.add(camera);// 创建球几何体
const sphereGeometry = new THREE.SphereBufferGeometry(3, 30, 30);
// const material = new THREE.MeshBasicMaterial({
//   color: 0xff0000,
//   wireframe: true,
// });
// const mesh = new THREE.Mesh(sphereGeometry, material);
// scene.add(mesh);// 设置点材质
const pointsMaterial = new THREE.PointsMaterial();
pointsMaterial.size = 0.1;
pointsMaterial.color.set(0xfff000);
// 相机深度而衰减
pointsMaterial.sizeAttenuation = true;// 载入纹理
const textureLoader = new THREE.TextureLoader();
const texture = textureLoader.load("./textures/particles/2.png");
// 设置点材质纹理
pointsMaterial.map = texture;
pointsMaterial.alphaMap = texture;
pointsMaterial.transparent = true; // 允许透明
pointsMaterial.depthWrite = false; // 叠加时使用
pointsMaterial.blending = THREE.AdditiveBlending; // 例子重合之后颜色叠加const points = new THREE.Points(sphereGeometry, pointsMaterial);scene.add(points);// 初始化渲染器
const renderer = new THREE.WebGLRenderer();
// 设置渲染的尺寸大小
renderer.setSize(window.innerWidth, window.innerHeight);
// 开启场景中的阴影贴图
renderer.shadowMap.enabled = true;
renderer.physicallyCorrectLights = true;// console.log(renderer);
// 将webgl渲染的canvas内容添加到body
document.body.appendChild(renderer.domElement);// // 使用渲染器,通过相机将场景渲染进来
// renderer.render(scene, camera);// 创建轨道控制器
const controls = new OrbitControls(camera, renderer.domElement);
// 设置控制器阻尼,让控制器更有真实效果,必须在动画循环里调用.update()。
controls.enableDamping = true;// 添加坐标轴辅助器
const axesHelper = new THREE.AxesHelper(5);
scene.add(axesHelper);
// 设置时钟
const clock = new THREE.Clock();function render() {let time = clock.getElapsedTime();controls.update();renderer.render(scene, camera);//   渲染下一帧的时候就会调用render函数requestAnimationFrame(render);
}render();// 监听画面变化,更新渲染画面
window.addEventListener("resize", () => {//   console.log("画面变化了");// 更新摄像头camera.aspect = window.innerWidth / window.innerHeight;//   更新摄像机的投影矩阵camera.updateProjectionMatrix();//   更新渲染器renderer.setSize(window.innerWidth, window.innerHeight);//   设置渲染器的像素比renderer.setPixelRatio(window.devicePixelRatio);
});

三、应用顶点着色打造绚丽多彩的星空

在这里插入图片描述

import * as THREE from "three";
// 导入轨道控制器
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls";
// 导入动画库
import gsap from "gsap";
// 导入dat.gui
import * as dat from "dat.gui";// 目标:使用pointes设置随机顶点打造星河const gui = new dat.GUI();
// 1、创建场景
const scene = new THREE.Scene();// 2、创建相机
const camera = new THREE.PerspectiveCamera(75,window.innerWidth / window.innerHeight,0.1,1000
);// 设置相机位置
camera.position.set(0, 0, 10);
scene.add(camera);const particlesGeometry = new THREE.BufferGeometry();
const count = 5000;// 设置缓冲区数组
const positions = new Float32Array(count * 3);
// 设置粒子顶点颜色
const colors = new Float32Array(count * 3);
// 设置顶点
for (let i = 0; i < count * 3; i++) {positions[i] = (Math.random() - 0.5) * 100;colors[i] = Math.random();
}
particlesGeometry.setAttribute("position",new THREE.BufferAttribute(positions, 3)
);
particlesGeometry.setAttribute("color", new THREE.BufferAttribute(colors, 3));// 设置点材质
const pointsMaterial = new THREE.PointsMaterial();
pointsMaterial.size = 0.5;
pointsMaterial.color.set(0xfff000);
// 相机深度而衰减
pointsMaterial.sizeAttenuation = true;// 载入纹理
const textureLoader = new THREE.TextureLoader();
const texture = textureLoader.load("./textures/particles/zs2.png");
// 设置点材质纹理
pointsMaterial.map = texture;
pointsMaterial.alphaMap = texture;
pointsMaterial.transparent = true;
pointsMaterial.depthWrite = false;
pointsMaterial.blending = THREE.AdditiveBlending;
// 设置启动顶点颜色
pointsMaterial.vertexColors = true;const points = new THREE.Points(particlesGeometry, pointsMaterial);scene.add(points);// 初始化渲染器
const renderer = new THREE.WebGLRenderer();
// 设置渲染的尺寸大小
renderer.setSize(window.innerWidth, window.innerHeight);
// 开启场景中的阴影贴图
renderer.shadowMap.enabled = true;
renderer.physicallyCorrectLights = true;// console.log(renderer);
// 将webgl渲染的canvas内容添加到body
document.body.appendChild(renderer.domElement);// // 使用渲染器,通过相机将场景渲染进来
// renderer.render(scene, camera);// 创建轨道控制器
const controls = new OrbitControls(camera, renderer.domElement);
// 设置控制器阻尼,让控制器更有真实效果,必须在动画循环里调用.update()。
controls.enableDamping = true;// 添加坐标轴辅助器
const axesHelper = new THREE.AxesHelper(5);
scene.add(axesHelper);
// 设置时钟
const clock = new THREE.Clock();function render() {let time = clock.getElapsedTime();controls.update();renderer.render(scene, camera);//   渲染下一帧的时候就会调用render函数requestAnimationFrame(render);
}render();// 监听画面变化,更新渲染画面
window.addEventListener("resize", () => {//   console.log("画面变化了");// 更新摄像头camera.aspect = window.innerWidth / window.innerHeight;//   更新摄像机的投影矩阵camera.updateProjectionMatrix();//   更新渲染器renderer.setSize(window.innerWidth, window.innerHeight);//   设置渲染器的像素比renderer.setPixelRatio(window.devicePixelRatio);
});import * as THREE from "three";
import { texture, equirectUV } from "three/nodes";import WebGPU from "three/addons/capabilities/WebGPU.js";
import WebGPURenderer from "three/addons/renderers/webgpu/WebGPURenderer.js";import { OrbitControls } from "three/addons/controls/OrbitControls.js";if (WebGPU.isAvailable() === false) {document.body.appendChild(WebGPU.getErrorMessage());throw new Error("No WebGPU support");
}const container = document.createElement("div");
document.body.appendChild(container);camera = new THREE.PerspectiveCamera(45,window.innerWidth / window.innerHeight,0.25,20
);
camera.position.set(1, 0, 0);const equirectTexture = new THREE.TextureLoader().load("textures/2294472375_24a3b8ef46_o.jpg"
);
equirectTexture.flipY = false;scene = new THREE.Scene();
scene.backgroundNode = texture(equirectTexture, equirectUV(), 0);function render() {controls.update();renderer.render(scene, camera);
}renderer = new WebGPURenderer();
renderer.setPixelRatio(window.devicePixelRatio);
renderer.setSize(window.innerWidth, window.innerHeight);
renderer.setAnimationLoop(render);
container.appendChild(renderer.domElement);controls = new OrbitControls(camera, renderer.domElement);
controls.autoRotate = true;
controls.rotateSpeed = -0.125; // negative, to track mouse pointer
controls.autoRotateSpeed = 1.0;window.addEventListener("resize", onWindowResize);function onWindowResize() {camera.aspect = window.innerWidth / window.innerHeight;camera.updateProjectionMatrix();renderer.setSize(window.innerWidth, window.innerHeight);
}

四、通过封装与相机裁剪实现漫天飞舞的雪花

在这里插入图片描述
雪花纷飞的效果可以使用旋转模拟

function render() {let time = clock.getElapsedTime();points.rotation.x = time * 0.3;points2.rotation.x = time * 0.5;points2.rotation.y = time * 0.4;points3.rotation.x = time * 0.2;points3.rotation.y = time * 0.2;controls.update();renderer.render(scene, camera);//   渲染下一帧的时候就会调用render函数requestAnimationFrame(render);
}render();
import * as THREE from "three";
// 导入轨道控制器
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls";
// 导入动画库
import gsap from "gsap";
// 导入dat.gui
import * as dat from "dat.gui";// 目标:设置漫天的雪花const gui = new dat.GUI();
// 1、创建场景
const scene = new THREE.Scene();// 2、创建相机
const camera = new THREE.PerspectiveCamera(75,window.innerWidth / window.innerHeight,0.1,30
);// 设置相机位置
camera.position.set(0, 0, 40);
scene.add(camera);function createPoints(url, size = 0.5) {const particlesGeometry = new THREE.BufferGeometry();const count = 10000;// 设置缓冲区数组const positions = new Float32Array(count * 3);// 设置粒子顶点颜色const colors = new Float32Array(count * 3);// 设置顶点for (let i = 0; i < count * 3; i++) {positions[i] = (Math.random() - 0.5) * 100;colors[i] = Math.random();}particlesGeometry.setAttribute("position",new THREE.BufferAttribute(positions, 3));particlesGeometry.setAttribute("color", new THREE.BufferAttribute(colors, 3));// 设置点材质const pointsMaterial = new THREE.PointsMaterial();pointsMaterial.size = 0.5;pointsMaterial.color.set(0xfff000);// 相机深度而衰减pointsMaterial.sizeAttenuation = true;// 载入纹理const textureLoader = new THREE.TextureLoader();const texture = textureLoader.load(`./textures/particles/${url}.png`);// 设置点材质纹理pointsMaterial.map = texture;pointsMaterial.alphaMap = texture;pointsMaterial.transparent = true;pointsMaterial.depthWrite = false;pointsMaterial.blending = THREE.AdditiveBlending;// 设置启动顶点颜色pointsMaterial.vertexColors = true;const points = new THREE.Points(particlesGeometry, pointsMaterial);scene.add(points);return points;
}const points = createPoints("1", 1.5);
const points2 = createPoints("xh", 1);
const points3 = createPoints("xh", 2);// 初始化渲染器
const renderer = new THREE.WebGLRenderer();
// 设置渲染的尺寸大小
renderer.setSize(window.innerWidth, window.innerHeight);
// 开启场景中的阴影贴图
renderer.shadowMap.enabled = true;
renderer.physicallyCorrectLights = true;// console.log(renderer);
// 将webgl渲染的canvas内容添加到body
document.body.appendChild(renderer.domElement);// // 使用渲染器,通过相机将场景渲染进来
// renderer.render(scene, camera);// 创建轨道控制器
const controls = new OrbitControls(camera, renderer.domElement);
// 设置控制器阻尼,让控制器更有真实效果,必须在动画循环里调用.update()。
controls.enableDamping = true;// 添加坐标轴辅助器
const axesHelper = new THREE.AxesHelper(5);
scene.add(axesHelper);
// 设置时钟
const clock = new THREE.Clock();function render() {let time = clock.getElapsedTime();points.rotation.x = time * 0.3;points2.rotation.x = time * 0.5;points2.rotation.y = time * 0.4;points3.rotation.x = time * 0.2;points3.rotation.y = time * 0.2;controls.update();renderer.render(scene, camera);//   渲染下一帧的时候就会调用render函数requestAnimationFrame(render);
}render();// 监听画面变化,更新渲染画面
window.addEventListener("resize", () => {//   console.log("画面变化了");// 更新摄像头camera.aspect = window.innerWidth / window.innerHeight;//   更新摄像机的投影矩阵camera.updateProjectionMatrix();//   更新渲染器renderer.setSize(window.innerWidth, window.innerHeight);//   设置渲染器的像素比renderer.setPixelRatio(window.devicePixelRatio);
});

五、运用数学知识打造复杂形状臂旋星系

在这里插入图片描述

import * as THREE from "three";
// 导入轨道控制器
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls";
// 导入动画库
import gsap from "gsap";
// 导入dat.gui
import * as dat from "dat.gui";// 目标:运用数学知识设计特定形状的星系const gui = new dat.GUI();
// 1、创建场景
const scene = new THREE.Scene();// 2、创建相机
const camera = new THREE.PerspectiveCamera(75,window.innerWidth / window.innerHeight,0.1,30
);const textureLoader = new THREE.TextureLoader();
const particlesTexture = textureLoader.load("./textures/particles/1.png");
// 设置相机位置
camera.position.set(0, 0, 10);
scene.add(camera);const params = {count: 10000,size: 0.1,radius: 5,branch: 3,color: "#ff6030",rotateScale: 0.3,endColor: "#1b3984",
};let geometry = null;
let material = null;
let points = null;
const centerColor = new THREE.Color(params.color);
const endColor = new THREE.Color(params.endColor);
const generateGalaxy = () => {// 生成顶点geometry = new THREE.BufferGeometry();//   随机生成位置和const positions = new Float32Array(params.count * 3);// 设置顶点颜色const colors = new Float32Array(params.count * 3);//   循环生成点for (let i = 0; i < params.count; i++) {//   当前的点应该在哪一条分支的角度上const branchAngel = (i % params.branch) * ((2 * Math.PI) / params.branch);// 当前点距离圆心的距离const distance = Math.random() * params.radius * Math.pow(Math.random(), 3);const current = i * 3;const randomX =(Math.pow(Math.random() * 2 - 1, 3) * (params.radius - distance)) / 5;const randomY =(Math.pow(Math.random() * 2 - 1, 3) * (params.radius - distance)) / 5;const randomZ =(Math.pow(Math.random() * 2 - 1, 3) * (params.radius - distance)) / 5;// const randomX = (Math.pow(Math.random() * 2 - 1, 3) * distance) / 5;// const randomY = (Math.pow(Math.random() * 2 - 1, 3) * distance) / 5;// const randomZ = (Math.pow(Math.random() * 2 - 1, 3) * distance) / 5;positions[current] =Math.cos(branchAngel + distance * params.rotateScale) * distance +randomX;positions[current + 1] = 0 + randomY;positions[current + 2] =Math.sin(branchAngel + distance * params.rotateScale) * distance +randomZ;// 混合颜色,形成渐变色const mixColor = centerColor.clone();mixColor.lerp(endColor, distance / params.radius);colors[current] = mixColor.r;colors[current + 1] = mixColor.g;colors[current + 2] = mixColor.b;}geometry.setAttribute("position", new THREE.BufferAttribute(positions, 3));geometry.setAttribute("color", new THREE.BufferAttribute(colors, 3));//   设置点材质material = new THREE.PointsMaterial({// color: new THREE.Color(params.color),size: params.size,sizeAttenuation: true,depthWrite: false,blending: THREE.AdditiveBlending,map: particlesTexture,alphaMap: particlesTexture,transparent: true,vertexColors: true,});points = new THREE.Points(geometry, material);scene.add(points);
};
generateGalaxy();// 初始化渲染器
const renderer = new THREE.WebGLRenderer();
// 设置渲染的尺寸大小
renderer.setSize(window.innerWidth, window.innerHeight);
// 开启场景中的阴影贴图
renderer.shadowMap.enabled = true;
renderer.physicallyCorrectLights = true;// console.log(renderer);
// 将webgl渲染的canvas内容添加到body
document.body.appendChild(renderer.domElement);// // 使用渲染器,通过相机将场景渲染进来
// renderer.render(scene, camera);// 创建轨道控制器
const controls = new OrbitControls(camera, renderer.domElement);
// 设置控制器阻尼,让控制器更有真实效果,必须在动画循环里调用.update()。
controls.enableDamping = true;// 添加坐标轴辅助器
const axesHelper = new THREE.AxesHelper(5);
scene.add(axesHelper);
// 设置时钟
const clock = new THREE.Clock();function render() {let time = clock.getElapsedTime();controls.update();renderer.render(scene, camera);//   渲染下一帧的时候就会调用render函数requestAnimationFrame(render);
}render();// 监听画面变化,更新渲染画面
window.addEventListener("resize", () => {//   console.log("画面变化了");// 更新摄像头camera.aspect = window.innerWidth / window.innerHeight;//   更新摄像机的投影矩阵camera.updateProjectionMatrix();//   更新渲染器renderer.setSize(window.innerWidth, window.innerHeight);//   设置渲染器的像素比renderer.setPixelRatio(window.devicePixelRatio);
});

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

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

相关文章

Linux云服务器限制ip进行ssh远程连接

对Linux云服务器限制IP进行SSH远程连接的原因主要有以下几点&#xff1a; 增加安全性&#xff1a;SSH是一种加密的网络传输协议&#xff0c;可以保护数据的机密性和完整性。通过限制SSH连接的IP地址&#xff0c;可以防止未经授权的访问和数据泄露。只有拥有访问权限的IP地址才…

Makefile三个版本的编写

1.Makefile Makefile是一个工程管理文件&#xff0c;简化编译的流程&#xff0c;完成自动化编译的过程 在Makefile中&#xff0c;会把编译的过程分为两步&#xff0c;先生成.o文件&#xff0c;再对.o文件链接&#xff0c;生成可执行文件 Makefile由变量、函数、和规则构成 2.引…

辅助驾驶功能开发-执行器篇(03)-Mobileye Control Requirements

1. 目的 本文描述了产品开发不同阶段(研发、验证和产品化)车辆集成的控制要求。 2. 控制接口要求 2.1 接口类型 控制模块与车辆之间的接口应基于CAN协议或Flexray协议。 2.2 通讯频率 控制模块与车辆之间的通讯频率应高于36Hz。通信频率优先选择为 50 Hz。 2.3 延迟 所有…

vulnhub_DeRPnStiNK靶机渗透测试

VulnHub2018_DeRPnStiNK靶机 https://www.vulnhub.com/entry/derpnstink-1,221/ flag1(52E37291AEDF6A46D7D0BB8A6312F4F9F1AA4975C248C3F0E008CBA09D6E9166) flag2(a7d355b26bda6bf1196ccffead0b2cf2b81f0a9de5b4876b44407f1dc07e51e6) flag4(49dca65f362fee401292ed7ada96f9…

ResNet简单解释

什么是Resnet&#xff1f; resnet是一种残差网络&#xff0c;简单看一下resnet的结构 上面是ResNet&#xff0c;下面是传统的 ResNet里的一小块就是这样的 为什么要引入ResNet&#xff1f; 理论上讲&#xff0c;随着网络加深&#xff0c;我们获取的信息越来越多多&#xff0…

WordPress主题模板 大前端D8 5.1版本完整开源版源码简洁大气多功能配置

源码测评&#xff1a;该模板官方已更新至5.2&#xff0c;但是这个5.1也是非常好用的&#xff0c;经测试所有页面均完好&#xff0c;推荐下载使用。 模板简介&#xff1a; 大前端D8 主题是一款非常牛逼的WordPress博客主题,响应式,功能齐全,支持手机,电脑,平板,非常适合做博客站…

​iOS安全加固方法及实现

目录 iOS安全加固方法及实现 摘要 引言 iOS安全加固方法及实现 一、字符串加密 二、类名方法名混淆 三、程序代码混淆 四、加入安全SDK 总结 参考资料 摘要 本文介绍了iOS平台下的应用安全保护方法&#xff0c;包括字符串加密、类名方法名混淆、程序代码混淆和加入安全…

User CSS 在性能优化方面的实践

目录 前言 1. 减少重绘和回流 1.1 用法 1.2 代码示例 1.3 理解 2. 使用CSS精灵 2.1 用法 2.2 代码示例 2.3 理解 3. 压缩CSS文件 3.1 用法 3.2 代码示例 3.3 理解 4. 使用媒体查询进行响应式设计 4.1 用法 4.2 代码示例 4.3 理解 5. 使用CSS预处理器和构建工…

2015年亚太杯APMCM数学建模大赛A题海上丝绸之路发展战略的影响求解全过程文档及程序

2015年亚太杯APMCM数学建模大赛 A题 海上丝绸之路发展战略的影响 原题再现 一带一路不是实体或机制&#xff0c;而是合作与发展的理念和主张。凭借现有有效的区域合作平台&#xff0c;依托中国与有关国家现有的双边和多边机制&#xff0c;利用古丝绸之路的历史象征&#xff0…

【跟小嘉学 Rust 编程】三十三、Rust的Web开发框架之一: Actix-Web的基础

系列文章目录 【跟小嘉学 Rust 编程】一、Rust 编程基础 【跟小嘉学 Rust 编程】二、Rust 包管理工具使用 【跟小嘉学 Rust 编程】三、Rust 的基本程序概念 【跟小嘉学 Rust 编程】四、理解 Rust 的所有权概念 【跟小嘉学 Rust 编程】五、使用结构体关联结构化数据 【跟小嘉学…

定义USB接口,鼠标类和键盘类都可以作为实现类去实现USB接口

目录 程序设计 程序分析 系列文章 ​ 如图所示,我们电脑上都有USB接口,当我们的鼠标和键盘插上去之后才可以使用,拔出来就关闭使用。其实具体是什么USB设备,笔记本并不关心,只要符合USB规格的设备都可以。鼠标和键盘要想能在电脑上使用,那么鼠标和键盘也必须遵守USB规范…

专家级数据恢复:UFS Explorer Professional Recovery Crack

UFS Explorer Professional Recovery - 一款功能强大且方便的数据恢复程序&#xff0c;支持检测大量文件系统、操作系统和各种类型的驱动器&#xff1a;从简单的闪存驱动器到复杂的复合存储&#xff08;各种级别的 RAID 阵列&#xff09;。 该程序由执业专家开发&#xff0c;并…

可以用商城源码做什么?

商城源码是一个基于电子商务流程的现代化的商城网站程序。它提供了一个完整的电子商务解决方案&#xff0c;包括产品目录、购物车、结账、订单和付款等功能。商城源码可以用于创建各种类型的电子商务网站&#xff0c; 在这篇文章中&#xff0c;我将介绍商城源码可能带来的各种…

【VUE】ArcoDesign之自定义主题样式和命名空间

前言 Arco Design是什么&#xff1f; Arco Design 是由字节跳动推出的企业级产品的完整设计和开发解决方案前端组件库 官网地址&#xff1a;https://arco.design/同时也提供了一套开箱即用的中后台前端解决方案&#xff1a;Arco Design Pro(https://pro.arco.design/) Arco De…

TSINGSEE青犀睡岗离岗检测算法——确保加油站安全运营

众所周知&#xff0c;加油站是一个需要24小时营业的场所&#xff0c;由于夜间加油人员较少&#xff0c;员工极易处于疲劳或者睡眠状态&#xff0c;为保障安全和效率&#xff0c;通过TSINGSEE青犀睡岗离岗检测算法在加油站场景中&#xff0c;可以及时发现工作人员的疲劳状况&…

YOLOv5— Fruit Detection

&#x1f368; 本文为[&#x1f517;365天深度学习训练营学习记录博客 &#x1f366; 参考文章&#xff1a;365天深度学习训练营-第7周&#xff1a;咖啡豆识别&#xff08;训练营内部成员可读&#xff09; &#x1f356; 原作者&#xff1a;[K同学啊 | 接辅导、项目定制](https…

业务架构、应用架构、技术架构、数据架构

架构规划的重要性 如果没有进行合理的架构规划&#xff0c;将会引发一系列的问题。为了避免这些问题的发生&#xff0c;企业需要进行业务架构、应用架构、技术架构和数据架构的全面规划和设计&#xff0c;以构建一个清晰、可持续发展的企业架构。 https://www.zhihu.com/que…

asp.net教务管理信息系统VS开发sqlserver数据库web结构c#编程Microsoft Visual Studio计算机毕业设计

一、源码特点 asp.net 教务管理信息系统是一套完善的web设计管理系统&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主要采用B/S模式开发。开发环境为vs2010&#xff0c;数据库为sqlserver2008&#xff0c;使用c#语言 开发 asp.net教务管理系统 应用技术&a…

适用于嵌入式arm的ffmpeg编解码

在嵌入式arm应用开发中&#xff0c;经常会遇到需要处理视频的情况&#xff0c;这时候就需要强大的开源工具ffmpeg出马了。 这里可以下载到各个版本的ffmpeg。 ffmpeg各版本https://www.videohelp.com/software/ffmpeg/old-versions 现在ffmpeg更新较频繁&#xff0c;如…

信钰证券:华为汽车概念股持续活跃 圣龙股份斩获12连板

近期&#xff0c;华为轿车概念股在A股商场遭到热捧&#xff0c;多只股票迭创前史新高。10月23日&#xff0c;华为轿车概念股再度走强&#xff0c;到收盘&#xff0c;板块内圣龙股份、银宝山新涨停&#xff0c;轿车ETF在重仓股提振下盘中一度上涨近2%。业界人士认为&#xff0c;…