Three.js 纹理贴图 - 环境贴图 - 纹理贴图 - 透明贴图 - 高光贴图

文章目录

  • Three.js 纹理贴图
    • 纹理贴图 map属性
      • 纹理贴图的映射方式 texture.Mapping
      • 纹理贴图的色彩空间 texture.colorSpace
        • 中途更新纹理的色彩空间 texture.needsUpdate
      • 纹理加载器 THREE.TextureLoader
        • 监听单个材质
        • 监听多个材质 - LoadingManager类
      • 1. 颜色贴图与材质的颜色
      • 2.渲染效果:UV坐标 - 描述纹理贴图的坐标
        • 自定义顶点UV`geometry.attributes.uv`
      • 纹理对象Texture阵列 - texture.wrapS、texture.wrapT与texture.repeat
      • 案例:矩形Mesh+背景透明png贴图
      • 案例:uv动画 - 纹理对象的偏移属性offset
        • 纹理贴图阵列 + UV动画
    • 环境贴图
      • 添加环境贴图 mesh材质的envMap属性
      • 使用立方体纹理加载器CubeTextureLoader加载环境贴图
    • 透明贴图 mesh的alphaMap属性 / 高光贴图 mesh的specularMap属性/光照贴图 mesh的lightMap属性/环境遮挡贴图 mesh的aoMap属性

Three.js 纹理贴图

  • 纹理贴图加载器TextureLoader.load()方法加载一张图片,返回一个纹理对象Texture
  • 立方体纹理加载器CubeTextureLoader.load()方法加载6张图片,返回一个立方体纹理对象CubeTexture立方体纹理对象CubeTexture的父类是纹理对象Texture

网格材质 Mesh的贴图属性

属性描述其他
map:Texture材质的颜色贴图使用范围:除MeshPhysicalMaterial
envMap : Texture环境贴图
alphaMap:透明贴图
alpha贴图是一张灰度纹理,用于控制整个表面的透明度。
需要开启材质的透明度属性
specularMap : Texture高光贴图用于控制对象表面的高光反射强度和位置,通常使用灰度图像来表示不同的反射强度值。可以通过reflectivity属性设置反射强度

纹理贴图 map属性

纹理贴图的映射方式 texture.Mapping

属性默认值:texture.Mapping = THREE.UVMapping
属性含义:如何将纹理题图应用到几何体表面

  • mapping 是一种将纹理贴到几何体表面上的技术
  • cube mapping 则是一种将纹理贴到立方体表面上的技术。
属性值描述使用
THREE.UVMapping UV贴图将二维纹理映射到三维物体表面的过程。在 Three.js 中,每个几何体都有一个 UV 坐标系,和几何体表面上的三角形网格一一对应。UV 坐标系中的每个点都映射到纹理图像上的一个像素,用来确定几何体表面的纹理贴图。U,V 坐标用来应用映射,要求是单个纹理。
一般与网格材质的map属性配合使用。
THREE.CubeReflectionMapping 立方体反射映射该映射模式将环境贴图作为一个立方体贴图,将六个面分别映射到对应的立方体面上,以模拟立方体环境映射和反射效果。cubeTexture.mapping的默认值
THREE.CubeRefractionMapping 立方体折射映射使用一个立方体贴图来表示环境光的折射,可以用来模拟环境光和镜面反射等效果该映射模式与 THREE.CubeReflectionMapping 类似,但是它模拟的是折射效果,环境贴图中的物体看作透明的,经过物体的折射后反射到表面上。
THREE.EquirectangularReflectionMapping 圆柱反射映射将环境贴图作为一个全景图片,将图片映射到球体或半球体上,以模拟球形环境映射和反射效果。类似cube mapping,只不过不是用立方体贴图,而是使用单个贴图?

可以配合材质的envMap属性使用
THREE.EquirectangularRefractionMapping 圆柱折射映射该映射模式与 THREE.EquirectangularReflectionMapping 类似,但是模拟的是折射效果,即将环境贴图中的物体看作透明的,经过物体的折射后反射到表面上。可以配合材质的envMap属性使用

纹理贴图的色彩空间 texture.colorSpace

在着色器中色值的提取与色彩的计算操作一般都是在线性空间。在webGL中,贴图或者颜色以sRGB传入时,必须转换为线性空间。计算完输出后再将线性空间转为sRGB空间。

属性值描述
默认值:THREE.NoColorSpace无色彩空间
THREE.SRGBColorSpace=“srgb” sRGB模式在感知光的强度方向均匀分布的灰度条
物理上的线性颜色空间,当计算机需要对sRGB像素运行图像处理算法时,一般会采用线性颜色空间计算。
THREE.LinearSRGBColorSpace = “srgb-linear” 线性模式按照发射光的轻度均匀分布的灰度条
sRGB是当今一般电子设备及互联网图像上的标准颜色空间。较适应人眼的感光。

在这里插入图片描述
可以理解为:在物理上18%亮度时人眼感知到的是50%亮度

中途更新纹理的色彩空间 texture.needsUpdate

如果在中途修改色彩空间,需要设置texture.needsUpdate=true才可以生效。

案例
比如采用gui交互控制器,修改色彩空间。如果中途修改色彩空间,不会生效,需要设置更新纹理才能生效。

gui.add(texture, 'colorSpace', {sRGB: THREE.SRGBColorSpace,liner: THREE.LinearSRGBColorSpace 
}).onChange( => {texture.needsUpdate  = true // 默认为false
})

请添加图片描述

纹理加载器 THREE.TextureLoader

纹理加载器:new THREE.TextureLoader( manager : LoadingManager )
参数:加载器使用的 loadingManager,默认值为THREE.DefaultLoadingManager
继承链:Loader → TextureLoader
返回值:返回创建的纹理加载器TextureLoader.

纹理对象的属性和方法

属性名和方法名描述
texture.offset:Vector2贴图单次重复中的起始偏移量(偏移贴图在Mesh上位置),分别表示U和V。

加载纹理- 得到纹理对象
textureLoader.load ( url : String, onLoad : (texture)=>{}, onProgress : Function, onError : Function ) : Texture
返回值:新的纹理对象texture,该纹理对象可以用于材质创建
注意点:异步加载,第三个参数在后续版本好像被遗弃了可以用undefined暂时占位

监听单个材质
import tile from "./assets/tile.jpg";// 初始化一个加载器
const loader = new THREE.TextureLoader();// 加载一个资源
loader.load(// 【参数1】资源URLtile,// 【参数2】onLoad回调function ( texture ) {// 【才材质加载成功后执行】const material = new THREE.MeshBasicMaterial( {map: texture} );},// 【参数3】目前暂不支持onProgress的回调undefined,// 【参数4】onError回调,function ( err ) {console.error( '材质加载失败' );}
)
监听多个材质 - LoadingManager类

语法:LoadingManager(onLoad:Function,onProgress:Function,, onError:Function,)
说明:处理并跟踪已加载和待处理的数据。
参数
onLoad:所有加载器加载完成后,将调用此函数。
onProgress: 当每个项目完成后,将调用此函数。
onError: 当一个加载器遇到错误时,将调用此函数。

// 设置加载管理器
const loadingManager = new THREE.LoadingManager(function() {console.log('图片加载完成')},function(url, loaded, total) {console.log(`图片加载中,本次加载的材质${url},第 ${loaded}/${total} 个材质`)},function(err) {console.log('图片加载失败', err)}
)// Three提供的纹理加载器
const textureLoader = new THREE.TextureLoader(loadingManager)// 导入纹理贴图基础贴图
const imgTexture1 = textureLoader.load('../assets/images/140.jpg')
const imgTexture2 = textureLoader.load('../assets/images/141.jpg')

执行输出

图片加载中,本次加载的材质../assets/images/140.jpg,第 1/2 个材质
图片加载中,本次加载的材质../assets/images/141.jpg,第 2/2 个材质
图片加载完成

1. 颜色贴图与材质的颜色

在vur中的引入方式
方式1.先import引入然后作为参数传递给load
方式2.将图片存储在public公共文件夹下

// 方式1
import map from "./assets/map.jpg";
const texLoader = new THREE.TextureLoader();
const texture = texLoader.load(map)// 方式2
import panda from "/panda.png";
const material = new THREE.MeshLambertMaterial({map:texLoader.load( panda),
});
// 这种写法也可以
const material = new THREE.MeshLambertMaterial({map:texLoader.load('../public/panda.png'),
});// 加载失败会报错,这里参数只是字符串
const texture = texLoader.load('./assets/map.jpg')

public里的文件不会处理,直接复制到打包文件。文件中的绝对地址也不会解析所以可以将图片放到public中。.开头的地址会被理解为相对地址,webpack会解析地址加载图片,这里不知道是不是load的参数没有被理解为相对地址去解析,所以才会报错?

vue中引入图片失败的原因及解决办法

材质的颜色贴图属性.map设置后,模型会从纹理贴图上采集像素值,这时候一般来说不需要再设置材质颜色.color

颜色贴图mapcolor属性颜色值会混合。如果没有特殊需要,设置了颜色贴图.map就不用设置·color

2.渲染效果:UV坐标 - 描述纹理贴图的坐标

是什么:顶点UV坐标可以在0~1.0之间任意取值,纹理贴图左下角对应的UV坐标是(0,0),右上角对应的坐标(1,1)。
在这里插入图片描述
作用:从纹理贴图上提取UV坐标范围的像素映射到网格模型Mesh的几何体表面上。

// 默认情况会自动提取
import panda from "../public/panda.png";const geometry = new THREE.BoxGeometry(100, 100,100);
const texLoader = new THREE.TextureLoader();
const texture = texLoader.load(panda )
const material = new THREE.MeshLambertMaterial({map:texture,
});
const mesh = new THREE.Mesh(geometry, material);
console.log(geometry.attributes.uv)

在这里插入图片描述

自定义顶点UVgeometry.attributes.uv

geometry.attributes.position描述几何体的顶点坐标
geometry.attributes.uv 描述纹理贴图的坐标
位置关系是一一对应的,每一个顶点位置对应一个纹理贴图的位置

根据纹理坐标将纹理贴图的对应位置裁剪映射到几何体的表面上。

const geometry = new THREE.BufferGeometry();
const vertices = new Float32Array([0, 0, 0, //顶点1坐标100, 0, 0, //顶点2坐标0, 100, 0, //顶点3坐标
]);
geometry.attributes.position = new THREE.BufferAttribute(vertices, 3);
const uv = new Float32Array([0, 0, //顶点1对应位置的纹理坐标uv1, 0, //顶点2对应位置的纹理坐标uv0, 1, //顶点3对应位置的纹理坐标uv
]);
geometry.attributes.uv = new THREE.BufferAttribute(uv, 2);

在这里插入图片描述

纹理对象Texture阵列 - texture.wrapS、texture.wrapT与texture.repeat

阵列就是不断的重复,如果使用一个规则的图形,load只需要加载一小部分,然后通过阵列完全显示,加快贴图加载的速度。

属性名描述参考值
texture.wrapS:number定义了纹理贴图在水平方向上将如何包裹,在UV映射中对应于U可选纹理常量中的包裹模式三个选项,默认是THREE.ClampToEdgeWrapping
texture.wrapT :number纹理贴图在垂直方向上将如何包裹,在UV映射中对应于V
texture.repeat:Vector2决定纹理在表面的重复次数,两个方向分别表示U和V-

包裹模式的可选值

包裹模式描述
THREE.RepeatWrapping纹理将简单地重复到无穷大
THREE.ClampToEdgeWrapping纹理中的最后一个像素将延伸到网格的边缘
THREE.MirroredRepeatWrapping在每次重复时将进行镜像
import tile from "./assets/tile.jpg";
// 1.创建地面
const geometry = new THREE.PlaneGeometry(300, 250);// 2.加载纹理对象
const texLoader = new THREE.TextureLoader();
const texture = texLoader.load(tile)//3.开启阵列,设置阵列模式
texture.wrapS = THREE.RepeatWrapping;
texture.wrapT = THREE.RepeatWrapping;
// uv两个方向纹理重复数量
texture.repeat.set(8,8);
const material = new THREE.MeshLambertMaterial({map:texture,
});

在这里插入图片描述

案例:矩形Mesh+背景透明png贴图

想要png贴图完全透明的部分不显示,需要将材质的transparent属性打开。

// 矩形平面网格模型设置背景透明的png贴图
import direction from "./assets/direction .jpg";
const geometry = new THREE.PlaneGeometry(60, 60); //默认在XOY平面上
const textureLoader = new THREE.TextureLoader();
const material = new THREE.MeshBasicMaterial({map: textureLoader.load(direction ),        transparent: true, //使用背景透明的png贴图,注意开启透明计算 
});
const mesh = new THREE.Mesh(geometry, material);
mesh.rotateX(-Math.PI / 2);

案例:uv动画 - 纹理对象的偏移属性offset

偏移之后的左边部分被截掉,右边的剩余部分为图片最后1px无限重复

// 渲染循环
function render() {texture.offset.x +=0.001;//设置纹理动画:偏移量根据纹理和动画需要,设置合适的值renderer.render(scene, camera);requestAnimationFrame(render);
}
render();

请添加图片描述

纹理贴图阵列 + UV动画

开启阵列之后,左边偏移消失的地方会拼接到右边偏移之后多出来的地方(首尾相连)

import * as THREE from "three";
import panda from "/panda.png";const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(45,window.innerWidth / window.innerHeight, 1,8000
);
camera.position.set(300,300,300)const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);const geometry = new THREE.PlaneGeometry(200, 200);
const loader = new THREE.TextureLoader();
const texture = loader.load(panda)
// 设置U方向阵列模式
texture.wrapS = THREE.RepeatWrapping;
// u方向纹理重复数量
texture.repeat.x=2;
const material = new THREE.MeshBasicMaterial( {map: texture
} );
const mesh = new THREE.Mesh(geometry, material);
scene.add(mesh);const ambient = new THREE.AmbientLight(0xffffff,3)
scene.add(ambient);document.body.appendChild(renderer.domElement);
// 渲染循环
function render() {texture.offset.x +=0.1;renderer.render(scene, camera);requestAnimationFrame(render);
}
render();

请添加图片描述

环境贴图

环境贴图是一类用于模拟环境反射光照的一种 3D 技术

为什么叫天空盒
OpenGL中天空盒的思想就是绘制一个大的立方体,然后将观察者放在立方体的中心,当相机移动时,这个立方体也跟着相机一起移动,这样相机就永远不会运动到场景的边缘。

在这里插入图片描述

添加环境贴图 mesh材质的envMap属性

给模型设置环境贴图后,可以将将光反射的环境部分映射到模型上(类似镜子将人反射在镜子上面)。

使用下图作为环境贴图
请添加图片描述
这里一定要将设置envMap.mapping,不然模型就是一片黑色,这里设置成THREE.EquirectangularReflectionMappingTHREE.EquirectangularRefractionMapping都可以。

// 这里的图片都在public文件夹下
const geometry = new THREE.PlaneGeometry(200, 200);
const loader = new THREE.TextureLoader();
const texture = loader.load("/assets/door.png") 
const material = new THREE.MeshBasicMaterial({map: texture,
});
loader.load("/assets/test.jpg",(envMap)=>{envMap.mapping = THREE.EquirectangularReflectionMapping;material.envMap = envMap;
})const mesh = new THREE.Mesh(geometry, material);
scene.add(mesh);

在这里插入图片描述

使用一个全景图作为环境贴图

loader.load("/assets/test.jpg",(envMap)=>{envMap.mapping = THREE.EquirectangularReflectionMapping;scene.background = envMap; // 将全景图设置为scen的背景scene.environment = envMap;material.envMap = envMap; // 设置为环境贴图后,可以在模型上看见光反射的环境
})

使用立方体纹理加载器CubeTextureLoader加载环境贴图

语法:new CubeTextureLoader( manager : LoadingManager )
参数:加载器使用的 loadingManager,默认值为THREE.DefaultLoadingManager
继承链:Loader → CubeTextureLoader
返回值:返回创建的立方体纹理加载器CubeTextureLoader.
描述:立方体纹理加载器CubeTextureLoader.load()方法加载6张图片,返回一个立方体纹理对象CubeTexture

loader.setPath 设置基础路径

// 加载环境贴图
// 加载周围环境6个方向贴图
// 上下左右前后6张贴图构成一个立方体空间const loader = new THREE.TextureLoader();
const texture = loader.load("/assets/door1.png")
const alphaMap = loader.load("/assets/mask.png")
const urls = ['/assets/tile.jpg', x轴正方向  p:正positive  n:负negative'/assets/tile.jpg', x轴负方向  p:正positive  n:负negative'/assets/tile.jpg', y轴正方向'/assets/tile.jpg', y轴负方向'/assets/tile.jpg', z轴正方向'/assets/tile.jpg', z轴负方向
]
let textureCube = new THREE.CubeTextureLoader().load(urls);
scene.background = textureCube;
const material = new THREE.MeshBasicMaterial({map: texture,envMap:textureCube,
});

透明贴图 mesh的alphaMap属性 / 高光贴图 mesh的specularMap属性/光照贴图 mesh的lightMap属性/环境遮挡贴图 mesh的aoMap属性

  • 透明贴图:alpha贴图是一张灰度纹理,用于控制整个表面的透明度。
  • 高光贴图:用于控制对象表面的高光反射强度和位置,通常使用灰度图像来表示不同的反射强度值。
  • 光照贴图:用于控制对象表面的光照强度和位置,通常使用灰度图像来表示不同的光照强度值。光照贴图可以让对象表面看起来更加真实,增强细节和立体感。
  • 环境光遮蔽贴图(AO贴图):用于控制对象表面在环境光下的遮蔽程度,通常使用灰度图像来表示不同的遮蔽程度值。
贴图类型黑色白色灰色
透明贴图alphaMap不透明区域完全透明不同程度的半透明
高光贴图specularMap不反射区域最大反射强度区域不同程度反射强度区域
光照贴图lightMap无光照五颜六色的光
环境遮蔽贴图aoMap完全被遮蔽没有遮蔽不同程度的遮蔽

案例代码
代码只显示某一贴图,测试时可以修改为不同贴图的设置属性,使用下图测试效果。在这里插入图片描述

const texture = loader.load("/assets/door.png")
const alphaMap = loader.load("/assets/transparent.png")
let planeMaterial = new THREE.MeshBasicMaterial({color: 0xffffff,map: texture,transparent: true, // 允许透明// 透明度贴图alphaMap: alphaMap,reflectivity: 0.5,  //设置反射强度
});

在这里插入图片描述

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

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

相关文章

Linux——存储管理

文章目录 基本分区磁盘简介磁盘分类linux的磁盘命名磁盘的分区方式 管理磁盘虚拟机添加硬盘查看磁盘信息磁盘分区流程创建分区创建文件系统挂载mount查看挂载信息 剩余空间继续分区MBR如何划分更多的分区为什么只能有4个主分区扩展分区的引入 逻辑卷LVM是什么特点术语创建LVMVG…

【STL-常用算法】

常用算法 概述: 算法主要是由头文件 algorithm functional numeric 组成algorithm是所有STL头文件中最大的一个,范围涉及到比较、 交换、查找、遍历操作、复制、修改等等numeric体积很小,只包括几个在序列上面进行简单数学运算的模板函数functional 定…

数据图表方案,企业视频生产数据可视化

在信息爆炸的时代,如何将复杂的数据转化为直观、生动的视觉信息,是企业在数字化转型中面临的挑战。美摄科技凭借其独特的数据图表方案,为企业在数据可视化领域打开了一扇全新的大门。 一、数据图表方案的优势 1、高效便捷:利用数…

vscode实时预览markdown效果

安装插件 Markdown Preview Enhanced 上面是搜索框 启动预览 右键->Open Preview On the Side 效果如下: 目录功能 目录功能还是使用gitee吧 push后使用gitee,gitee上markdown支持侧边生成目录

Android矩阵Matrix裁切setRectToRect拉伸Bitmap替代Bitmap.createScaledBitmap缩放,Kotlin

Android矩阵Matrix裁切setRectToRect拉伸Bitmap替代Bitmap.createScaledBitmap缩放,Kotlin class MyImageView : AppCompatImageView {private var mSrcBmp: Bitmap? nullprivate var testIV: ImageView? nullconstructor(ctx: Context, attrs: AttributeSet) :…

一步到位:用Python实现PC屏幕截图并自动发送邮件,实现屏幕监控

在当前的数字化世界中,自动化已经成为我们日常生活和工作中的关键部分。它不仅提高了效率,还节省了大量的时间和精力。在这篇文章中,我们将探讨如何使用Python来实现一个特定的自动化任务 - PC屏幕截图自动发送到指定的邮箱。 这个任务可能看…

解决Linux Shell脚本错误:“/bin/bash^M: bad interpreter: No such file or directory”

在Linux系统中运行Shell脚本时,你可能会遇到一个常见的错误,错误信息如下: -bash: ./xxx.sh: /bin/bash^M: bad interpreter: No such file or directory这个错误通常是由于Shell脚本文件中存在不兼容的换行符引起的。在Windows系统中&#…

YoloV8改进策略:Block改进|DCNv4最新实践|高效涨点|完整论文翻译

摘要 涨点效果:在我自己的数据集上,mAP50 由0.986涨到了0.991,mAP50-95由0.737涨到0.753,涨点明显! DCNv4是可变形卷积的第四版,速度和v3相比有了大幅度的提升,但是环境搭建有一定的难度,对新手不太友好。如果在使用过程遇到编译的问题,请严格按照我写的环境配置。…

Linux 系统开始配置

文章目录 备份源为root 设置密码安装基本工具切换root 用户删除snap从 Ubuntu 移除 Snap 后使用 deb 文件安装软件商店和 Firefox在 Ubuntu 系统恢复到 Snap 软件包总结 删除 vim安装neovim在线安装neovim压缩安装neovim安装lazyvim安装剪切板 安装qt配置 Qt 环境不在sudoers文…

链表中的数字相加

不能简单认为将两条链表转变为整数后进行运算,然后将结果转变为链表。因为如果链表很长,这可能会导致整数溢出。 在正常的两个整数加法运算时,我们是从低位开始,然后依次相加更高位的数字,所以不难想到我们需要将链表反…

Git提交忽略指定文件

1.创建.gitignore文件存放到和.git同级的根目录下 #提交git时要忽略的文件或者文件夹,根据自己的需求来写 .idea target*.log *.iml *.jar *.war *.nar *.ear *.zip *.rar *.tar.gz2.提交.gitignore文件文件到远程仓库 分两种情况 .idea、target等无关文件已经提交到…

(每日持续更新)jdk api之NotSerializableException基础、应用、实战

博主18年的互联网软件开发经验,从一名程序员小白逐步成为了一名架构师,我想通过平台将经验分享给大家,因此博主每天会在各个大牛网站点赞量超高的博客等寻找该技术栈的资料结合自己的经验,晚上进行用心精简、整理、总结、定稿&…

【动态规划】【记忆化搜索】【回文】1312让字符串成为回文串的最少插入次数

作者推荐 【动态规划】【字符串】【表达式】2019. 解出数学表达式的学生分数 本文涉及知识点 动态规划汇总 记忆化搜索 回文 字符串 LeetCode1312. 让字符串成为回文串的最少插入次数 给你一个字符串 s ,每一次操作你都可以在字符串的任意位置插入任意字符。 请…

基于Java SSM框架实现校园快领服务系统项目【项目源码+论文说明】

基于java的SSM框架实现校园快领服务系统演示 摘要 随着科学技术的飞速发展,各行各业都在努力与现代先进技术接轨,通过科技手段提高自身的优势;对于校园快领服务系统当然也不能排除在外,随着网络技术的不断成熟,带动了…

Python爬虫的基本原理

我们可以把互联网比作一张大网,而爬虫(即网络爬虫)便是在网上爬行的蜘蛛。把网的节点比作一个个网页,爬虫爬到这就相当于访问了该页面,获取了其信息。可以把节点间的连线比作网页与网页之间的链接关系,这样…

双非本科准备秋招(14.3)—— java线程

创建和运行线程 1、使用Thread Slf4j(topic "c.Test1")public class Test1 {public static void main(String[] args) {Thread t new Thread("t1") {Overridepublic void run() {log.debug("running");}};t.start();​log.debug("runnin…

react实现组件通信的案例

当使用React构建应用程序时,组件通信是一个重要的话题。以下是一个示例,演示了如何使用React实现组件间的通信: 常规方法: // ParentComponent.js import React, { useState } from react; import ChildComponent from ./ChildC…

Windows 共享文件 netlogon和sysvol的作用

在Windows域环境中&#xff0c;Netlogon和SYSVOL是两个非常重要的共享文件夹&#xff0c;它们由域控制器自动创建并管理&#xff0c;对于Active Directory&#xff08;AD&#xff09;域的正常运行至关重要&#xff1a; NETLOGON共享&#xff1a; 位置&#xff1a;\\<domain_…

牛客——扫雷MINE(dp,dfs,枚举+递推)

链接&#xff1a;登录—专业IT笔试面试备考平台_牛客网 来源&#xff1a;牛客网 题目描述 相信大家都玩过扫雷的游戏。那是在一个n*m的矩阵里面有一些雷&#xff0c;要你根据一些信息找出雷来。 万圣节到了 &#xff0c;“余”人国流行起了一种简单的扫雷游戏&#xff0c;…

【BIAI】Lecture 9-Motor system 1

Motor System 专业词汇 skeletal muscle 骨骼肌 smooth muscle 平滑肌 cardiac muscle 心肌 flexor reflex 屈曲反射 central pattern generators 中央模式生成器 bio-inspired bipedal robots 仿生双足机器人 myotatic stretch reflex 肌肉自伸展反射 Cortex optic nerve 视皮…