【2】A-Frame核心设计

一、基于HTML和Primitives的表达

1.HTML - 超文本标记语言

A-Frame 基于 HTML 和 DOM 之上,使用自定义元素的 polyfill。 HTML 是 Web 的构建块,提供了最易于访问的计算语言之一。无需安装或构建步骤,使用 HTML 创建仅涉及 HTML 文件中的文本并在浏览器中打开 HTML 文件。由于大多数 Web 都是基于 HTML 构建的,因此大多数现有工具和库都可以使用 A-Frame,包括 React、Vue.js、Angular、d3.js 和 jQuery。

如果您没有太多 HTML 经验,没问题!它相当容易上手,甚至比 2D HTML 更容易掌握。一旦您掌握了 HTML 的一般结构或语法(开始标记、属性、结束标记),那么您就可以开始了!。

2.Primitives - 原语

虽然 HTML 层看起来很基础,但 HTML 和 DOM 只是 A-Frame 最外层的抽象层。在底层,A-Frame 是一个以声明方式公开的 Three.js 实体组件框架。

(1)什么是原语?

A-Frame 提供了一些称为原语的元素,例如 <a-box><a-sky> ,它们包装了实体-组件模式,以使其对初学者有吸引力。 A-Frame 提供的开箱即用的每个原语。开发人员也可以创建自己的原语。拿A-Frame整体介绍中的例子:

<html><head><script src="https://aframe.io/releases/1.6.0/aframe.min.js"></script></head><body><a-scene><a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box><a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere><a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D"></a-cylinder><a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane><a-sky color="#ECECEC"></a-sky></a-scene></body>
</html>

原语主要充当新手的便利层(即语法糖)。现在请记住,原语的底层是 <a-entity>

  • 有一个语义名称(例如 <a-box>

  • 拥有一组带有默认值的预设组件

  • 将 HTML 属性映射或代理到组件数据

原语类似于 Unity 中的预置体。一些有关实体-组件-系统模式的文档将它们称为组合。他们将核心实体组件 API 抽象为:

  • 将有用的组件与规定的默认值一起预先组合

  • 充当复杂但常见的实体类型的简写(例如 <a-sky>

  • 为初学者提供熟悉的界面,因为 A-Frame 将 HTML 带到了新的方向

在底层,这个 <a-box> 原语:

<a-box color="red" width="3"></a-box>

表示这个实体组件形式:

<a-entity geometry="primitive: box; width: 3" material="color: red"></a-entity>

<a-box>geometry.primitive 属性默认为 box 。该基元将 HTML width 属性映射到底层 geometry.width 属性,并将 HTML color 属性映射到底层 material.color 属性。

(2)如何将组件附加到原语?

原语只是底层的 <a-entity> 。这意味着原语具有与实体相同的 API,例如位置、旋转、缩放和附加组件。

例子:

让我们将社区物理组件附加到原语上。我们包含 Don McCurdy 的 aframe-physics-system 的源代码,并通过 HTML 属性附加物理组件:

<html><head><script src="https://aframe.io/releases/1.6.0/aframe.min.js"></script><script src="https://unpkg.com/aframe-physics-system@1.6.0/dist/aframe-physics-system.min.js"></script></head><body><a-scene physics><a-box position="-1 4 -3" rotation="0 45 0" color="#4CC3D9" dynamic-body></a-box><a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4" static-body></a-plane><a-sky color="#ECECEC"></a-sky></a-scene></body>
</html>

(3)如何注册原语?

我们可以使用 AFRAME.registerPrimitive(name, definition) 注册我们自己的原语(即注册一个元素)。 name 是一个字符串,必须包含破折号(即 'a-foo' )。 definition 是定义以下属性的 JavaScript 对象:

属性

描述

举例

defaultComponents

指定原语默认组件的对象。键是组件的名称,值是组件的默认数据。

{geometry: {primitive: 'box'}}

mappings

指定 HTML 属性名称和组件属性名称之间映射的对象。每当更新 HTML 属性名称时,原语就会更新相应的组件属性。组件属性使用点语法 ${componentName}.${propertyName} 定义。

{depth: 'geometry.depth', height: 'geometry.height', width: 'geometry.width'}

例子:

例如,下面是 A-Frame 对 <a-box> 原语的注册:

var extendDeep = AFRAME.utils.extendDeep;// The mesh mixin provides common material properties for creating mesh-based primitives.
// This makes the material component a default component and maps all the base material properties.
var meshMixin = AFRAME.primitives.getMeshMixin();AFRAME.registerPrimitive('a-box', extendDeep({}, meshMixin, {// Preset default components. These components and component properties will be attached to the entity out-of-the-box.defaultComponents: {geometry: {primitive: 'box'}},// Defined mappings from HTML attributes to component properties (using dots as delimiters).// If we set `depth="5"` in HTML, then the primitive will automatically set `geometry="depth: 5"`.mappings: {depth: 'geometry.depth',height: 'geometry.height',width: 'geometry.width'}
}));

例如,Don McCurdy 的 aframe-extras 包包含一个包装其 ocean 组件的 <a-ocean> 原语。这是 <a-ocean> 的定义。

AFRAME.registerPrimitive('a-ocean', {// Attaches the `ocean` component by default.// Defaults the ocean to be parallel to the ground.defaultComponents: {ocean: {},rotation: {x: -90, y: 0, z: 0}},// Maps HTML attributes to the `ocean` component's properties.mappings: {width: 'ocean.width',depth: 'ocean.depth',density: 'ocean.density',color: 'ocean.color',opacity: 'ocean.opacity'}
});

注册了 <a-ocean> 原语后,我们就可以使用一行传统的 HTML 创建海洋:

<a-ocean color="aqua" depth="100" width="100"></a-ocean>

二、基于ECS(实体-组件-系统)架构

1.什么是ECS?

ECS 架构是 3D 和游戏开发中常见且理想的模式,遵循组合优于继承和层次结构原则。

(1)ECS优势

  • 通过混合和匹配可重用部件来定义对象时具有更大的灵活性。

  • 消除了具有复杂交织功能的长继承链的问题。

  • 通过解耦、封装、模块化、可重用性促进清洁设计。

  • 就复杂性而言,构建 VR 应用程序的最具可扩展性的方法。

  • 经过验证的 3D 和 VR 开发架构。

  • 允许扩展新功能(可能将它们作为社区组件共享)。

在 2D Web 上,我们在层次结构中布置具有固定行为的元素。 3D和VR是不同的;有无限种可能的对象具有无限的行为。 ECS 提供了一种可管理的模式来构造对象类型。

以下是 ECS 架构的精彩介绍材料。我们建议浏览一下它们以更好地掌握其好处。 ECS 非常适合 VR 开发,而 A-Frame 完全基于此范例:

  • Entity-component-system on Wikipedia

  • What is an Entity System? by Adam Martin

  • Decoupling Patterns — Component on Game Programming Patterns

  • Evolve Your Hierarchy by Mick West

Unity是实现ECS的著名游戏引擎。尽管跨实体通信存在一些痛点,但我们将看到 A-Frame、DOM 和声明性 HTML 如何真正让 ECS 发光发热。

(2)ECS定义

ECS 的基本定义包括:

  • 实体:是可以附加组件的容器对象。实体是场景中所有对象的基础。如果没有组件,实体既不会执行也不会渲染任何内容,类似于空的 <div>

  • 组件:是可重用的模块或数据容器,可以附加到实体以提供外观、行为和/或功能。组件就像对象的即插即用。所有逻辑都是通过组件来实现的,我们通过混合、匹配和配置组件来定义不同类型的对象。就像炼金术一样!

  • 系统:为组件类别提供全局范围、管理和服务。系统通常是可选的,但我们可以用它们来分离逻辑和数据;系统处理逻辑,组件充当数据容器

(3)举例

通过将不同组件组合在一起构建的不同类型实体的一些抽象示例:

  • Box = Position + Geometry + Material

  • Light Bulb = Position + Light + Geometry + Material + Shadow

  • Sign = Position + Geometry + Material + Text

  • VR Controller = Position + Rotation + Input + Model + Grab + Gestures

  • Ball = Position + Velocity + Physics + Geometry + Material

  • Player = Position + Camera + Input + Avatar + Identity

作为另一个抽象示例,假设我们想要通过组装组件来构建汽车实体:

  • 我们可以附加一个 material 组件,该组件具有影响汽车外观的“颜色”或“光泽度”等属性。

  • 我们可以附加一个 engine 组件,该组件具有影响汽车功能的“马力”或“重量”等属性。

  • 我们可以附加一个 tire 组件,该组件具有影响汽车行为的“轮胎数量”或“转向角”等属性。

因此,我们可以通过改变 materialenginetire 组件的属性来创建不同类型的汽车。 materialenginetire 组件不必相互了解,甚至可以在其他情况下单独使用。我们可以混合搭配它们来创造不同类型的车辆:

  • 要创建船实体:删除 tire 组件。

  • 创建摩托车实体:将 tire 组件的轮胎数量更改为2个,将 engine 组件配置得更小。

  • 要创建飞机实体:附加 wingjet 组件。

与传统的继承相比,如果我们想要扩展一个对象,我们必须创建一个试图处理所有内容或继承链的大类。

2.A-Frame中的ECS

A-Frame 具有代表每个 ECS 的 API:

  • 实体:<a-entity> 元素和原型表示。

  • 组件:<a-entity> 上的 HTML 属性表示。下面,组件是包含架构、生命周期处理程序和方法的对象。组件通过 AFRAME.registerComponent (name, definition) API 注册。

  • 系统:<a-scene> 的 HTML 属性表示。系统在定义上与组件类似。系统通过 AFRAME.registerSystem (name, definition) API 注册。

(1)语法

创建<a-entity>并将组件附加为 HTML 属性。大多数组件都有多个属性,这些属性由类似于HTMLElement.styleCSS 的语法表示。此语法采用以下形式:用冒号 (:) 分隔属性名称和属性值,并用分号 (;) 分隔不同的属性声明:

<a-entity ${componentName}="${propertyName1}: ${propertyValue1}; ${propertyName2}: ${propertyValue2}">

例如,我们有<a-entity>并附加具有各种属性和属性值的几何体、材质、灯光和位置组件:

<a-entitygeometry="primitive: sphere; radius: 1.5"light="type: point; color: white; intensity: 2"material="color: white; shader: flat; src: glow.jpg"position="0 0 -5">
</a-entity>

(2)组合实体

我们可以附加更多组件来添加额外的外观、行为或功能(例如物理)。或者我们可以更新组件值来配置实体(以声明方式或通过.setAttribute)。

由多个组件组成的一种常见实体类型是 VR 中玩家的手。玩家的手可以有很多组成部分:外观、手势、行为、与其他对象的交互性。

我们将组件插入手实体以提供其行为,就像我们为 VR 附加超能力或增强功能一样!下面的每个组件彼此不了解,但可以组合起来定义一个复杂的实体:

<a-entitytracked-controls  <!-- Hook into the Gamepad API for pose. -->vive-controls  <!-- Vive button mappings. -->oculus-touch-controls  <!-- Oculus button mappings. -->hand-controls  <!-- Appearance (model), gestures, and events. -->laser-controls <!-- Laser to interact with menus and UI. -->sphere-collider  <!-- Listen when hand is in contact with an object. -->grab  <!-- Provide ability to grab objects. -->throw <!-- Provide ability to throw objects. -->event-set="_event: grabstart; visible: false"  <!-- Hide hand when grabbing object. -->event-set="_event: grabend; visible: true"  <!-- Show hand when no longer grabbing object. -->
>

(3)基于声明式 DOM 的 ECS

A-Frame 通过使其具有声明性并基于 DOM,将 ECS 提升到了另一个水平。传统上,基于 ECS 的引擎将通过代码创建实体、附加组件、更新组件、删除组件。但 A-Frame 具有 HTML 和 DOM,这使得 ECS 符合人体工程学并解决了它的许多弱点。以下是 DOM 为 ECS 提供的功能:

  1. 使用查询选择器引用其他实体:DOM 提供了强大的查询选择器系统,它允许我们查询场景图并选择与条件匹配的一个或多个实体。我们可以通过 ID、类或数据属性获取对实体的引用。因为 A-Frame 基于 HTML,所以我们可以直接使用查询选择器。 document.querySelector('#player')

  2. 与事件解耦的跨实体通信:DOM 提供侦听和发出事件的能力。这提供了实体之间的发布-订阅通信系统。组件不必相互了解,它们只需发出一个事件(可能会冒泡),其他组件可以监听这些事件而无需相互调用。 ball.emit('collided')

  3. 使用 DOM API 进行生命周期管理的 API:DOM 提供 API 来更新 HTML 元素和树,包括 .setAttribute.removeAttribute.createElement.removeChild

  4. 使用属性选择器进行实体过滤:DOM 提供属性选择器,允许我们查询具有或不具有某些 HTML 属性的一个或多个实体。这意味着我们可以请求具有或不具有特定组件集的实体。 document.querySelector('[enemy]:not([alive])')

  5. 声明性:DOM 提供 HTML。 A-Frame 在 ECS 和 HTML 之间建立了桥梁,使本已干净的模式具有声明性、可读性和可复制粘贴性。

(4)可扩展性

A-Frame组件无所不能。开发人员可以获得无需许可的创新来创建组件来扩展任何功能。组件可以完全访问 JavaScript、 Three.js 和 Web API(例如 WebRTC、语音识别)。

稍后我们将详细介绍如何编写 A-Frame 组件。作为预览,基本组件的结构可能如下所示:

AFRAME.registerComponent('foo', {schema: {bar: {type: 'number'},baz: {type: 'string'}},init: function () {// Do something when component first attached.},update: function () {// Do something when component's data is updated.},remove: function () {// Do something when the component or its entity is detached.},tick: function (time, timeDelta) {// Do something on every scene tick or frame.}
});

声明式 ECS 使我们能够编写 JavaScript 模块并通过 HTML 对其进行抽象。注册组件后,我们可以通过 HTML 属性以声明方式将此代码模块插入到实体中。这种从代码到 HTML 的抽象使 ECS 变得强大且易于推理。 foo 是我们刚刚注册的组件名称,数据包含 barbaz 属性:

<a-entity foo="bar: 5; baz: bazValue"></a-entity>

(4)基于组件的开发模式

为了构建 VR 应用程序,我们建议将所有应用程序代码放置在组件(和系统)中。理想的 A-Frame代码库纯粹由模块化、封装和解耦的组件组成。这些组件可以单独进行单元测试,也可以与其他组件一起进行单元测试。

当仅使用组件创建应用程序时,其代码库的所有部分都可以重用!组件可以共享给其他开发人员使用,或者我们可以在其他项目中重用它们。或者可以对组件进行分叉和修改以适应其他用例。

一个简单的 ECS 代码库的结构可能如下:

index.html
components/ball.jscollidable.jsgrabbable.jsenemy.jsscoreboard.jsthrowable.js

(5)高阶组件

组件可以在实体上设置其他组件,使它们成为抽象上的更高阶或更高级别的组件。

例如,光标组件设置并构建在光线投射器组件之上。或者手动控制组件设置并构建在 vive-controls 组件和 oculus-touch-controls 组件之上,而 oculus-touch-controls 组件又构建在 tracked-controls 组件之上。

3.社区组件生态

组件可以共享到A-Frame生态系统中供社区使用。 A-Frame ECS 的美妙之处在于可扩展性。经验丰富的开发人员可以开发物理系统或图形着色器组件,而新手开发人员只需放入 <script> 标记即可从 HTML 获取这些组件并在场景中使用它们。我们可以使用强大的已发布组件,而无需接触 JavaScript。

(1)哪里可以找到组件?

市面上有数百个组件。我们尽力让它们被发现。如果您开发了组件,请通过这些渠道提交分享!

1)npm 新项目管理

大多数 A-Frame 组件都发布在 npm 和 GitHub 上。我们可以使用 npm 的搜索来搜索 aframe-components 。 npm 让我们可以按质量、受欢迎程度和维护情况进行排序。这是查找更完整的组件列表的好地方。

2)GitHub 项目

许多 A-Frame 应用程序纯粹是由组件开发的,其中许多 A-Frame 应用程序都是在 GitHub 上开源的。他们的代码库将包含我们可以直接使用、引用或复制的组件。需要关注的项目包括:

  • BeatSaver Viewer 

  • Super Says

  • A-Painter

  • A-Blast 

3)A-Frame博客

A-Frame 博客档案包含组件发布或更新时的详细信息,并且是查找组件链接的好地方。

4)A-Frame Wiki

A-Frame Wiki 是一项有用的社区驱动计划,用于收集有关可用 A-Frame 组件的信息和提示。鼓励每个人参与。添加和编辑信息非常容易。

(2)使用社区组件

一旦找到想要使用的组件,我们就可以将该组件包含为 <script> 标记并从 HTML 中使用它。

例如,我们使用 IdeaSpaceVR 的粒子系统组件:

1)使用unpkg

首先,我们必须获取组件 JS 文件的 CDN 链接。组件的文档通常会有 CDN 链接或使用信息。但获取最新 CDN 链接的一种方法是使用 unpkg.com。

unpkg 是一个 CDN,它自动托管发布到 npm 的所有内容。 unpkg 可以解析语义版本控制并为我们提供我们想要的组件的版本。 URL 采用以下形式:

https://unpkg.com/<npm package name>@<version>/<path to file>

如果我们想要最新版本,我们可以排除 version

https://unpkg.com/<npm package name>/<path to file>

我们可以排除 path to file 来浏览组件包的目录,而不是输入构建的组件 JS 文件的路径。 JS 文件通常位于名为 dist/build/ 的文件夹中,并以 .min.js 结尾。

对于粒子系统组件,我们前往:

https://unpkg.com/aframe-particle-system-component/

请注意结尾斜杠 ( / )。找到我们需要的文件,右键单击,然后点击“复制链接到地址”,将 CDN 链接复制到剪贴板。

2)包含组件 JS 文件

然后转到我们的 HTML。在 <head> 下,A-Frame JS <script> 标记之后, <a-scene> 之前,我们将包含带有 <script> 的 JS 文件标签。

对于粒子系统组件,我们之前(在撰写本文时)发现的 CDN 链接是:

https://unpkg.com/aframe-particle-system-component@1.0.9/dist/aframe-particle-system-component.min.js

现在我们可以将它包含到我们的 HTML 中:

<html><head><script src="https://aframe.io/releases/1.6.0/aframe.min.js"></script><script src="https://unpkg.com/aframe-particle-system-component@1.0.9/dist/aframe-particle-system-component.min.js"></script></head><body><a-scene></a-scene></body>
</html>
3)使用组件

请遵循该组件的文档,了解如何在实现中使用它。但一般来说,使用涉及将组件附加到实体并对其进行配置。对于粒子系统组件:

现在我们可以将它包含到我们的 HTML 中:

<html><head><script src="https://aframe.io/releases/1.6.0/aframe.min.js"></script><script src="https://unpkg.com/aframe-particle-system-component@1.0.9/dist/aframe-particle-system-component.min.js"></script></head><body><a-scene><a-entity particle-system="preset: snow" position="0 0 -10"></a-entity></a-scene></body>
</html>

(3)例子

<html><head><title>Community Components Example</title><meta name="description" content="Community Components Example"><script src="https://aframe.io/releases/1.6.0/aframe.min.js"></script>  <script src="https://cdn.jsdelivr.net/gh/c-frame/aframe-particle-system-component@a5a8449/dist/aframe-particle-system-component.js"></script><script src="https://cdn.jsdelivr.net/npm/aframe-simple-sun-sky@^1.2.2/simple-sun-sky.js"></script><script src="https://cdn.jsdelivr.net/gh/c-frame/aframe-extras@d5f3f8/dist/aframe-extras.min.js"></script></head><body><a-scene> <a-entity id="rain" particle-system="preset: rain; color: #24CAFF; particleCount: 5000"></a-entity><a-entity id="sphere" geometry="primitive: sphere"material="color: #EFEFEF; shader: flat"position="0 0.15 -5"light="type: point; intensity: 5"animation="property: position; easing: easeInOutQuad; dir: alternate; dur: 1000; to: 0 -0.10 -5; loop: true"></a-entity><a-entity id="ocean" ocean="density: 20; width: 50; depth: 50; speed: 4"material="color: #9CE3F9; opacity: 0.75; metalness: 0; roughness: 1"rotation="-90 0 0"></a-entity><a-simple-sun-sky sun-position="1 0.4 0"></a-simple-sun-sky><a-entity id="light" light="type: ambient; color: #888"></a-entity></a-scene></body>
</html>

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

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

相关文章

无人机之穿越机注意事项篇

一、检查设备 每次飞行前都要仔细检查穿越机的每个部件&#xff0c;确保所有功能正常&#xff0c;特别是电池和电机。 二、遵守法律 了解并遵循你所在地区关于无人机的飞行规定&#xff0c;避免非法飞行。 三、评估环境 在飞行前检查周围环境&#xff0c;确保没有障碍物和…

182440-00SF 同轴连接器

型号简介 182440-00SF是Southwest Microwave的一款连接器。该连接器采用 BeCu UNqS C17300 材料&#xff0c;并进行了镀金处理&#xff0c;以确保良好的导电性和耐腐蚀性&#xff1b;螺纹采用符合 ASTM A2582 标准的钢制合金&#xff0c;并进行磷酸盐钝化处理&#xff0c;以提高…

Labview_压缩文件

调用顺序 源文件 生成后的文件 1.新建ZIP文件 生成ZIP文件的路径&#xff1a;为最终生成ZIP文件的路径&#xff0c;需要提供ZIP文件的名称和类型 2.添加文件到压缩文件 源文件路径&#xff1a;为需要压缩的文件路径&#xff0c;非文件夹路径 生成ZIP文件时的路径&#x…

Git错误分析

错误案例1&#xff1a; 原因&#xff1a;TortoiseGit多次安装导致&#xff0c;会记录首次安装路径&#xff0c;若安装路径改变&#xff0c;需要配置最后安装的路径。

《RWKV》论文笔记

原文出处 [2305.13048] RWKV: Reinventing RNNs for the Transformer Era (arxiv.org) 原文笔记 What RWKV(RawKuv):Reinventing RNNs for the Transformer Era 本文贡献如下&#xff1a; 提出了 RWKV 网络架构&#xff0c;结合了RNNS 和Transformer 的优点&#xff0c;同…

触摸屏虚拟键盘组件 jQuery Virtual Keyboard使用 自定义键盘

如何在触摸设备上为输入域添加虚拟键盘&#xff1f; 一个插件可以解决这个问题&#xff0c;关键还支持高度自定义&#xff08;git地址&#xff09;&#xff1a; GitHub - Mottie/Keyboard: Virtual Keyboard using jQuery ~ 官网地址&#xff1a;Virtual Keyboard 使用步骤&…

Node.js 生成vue组件

在项目根目录下创建 create.js /*** 脚本生成vue组件* 主要是利用node自带的fs模块操作文件的写入* ===========================================* 准备步骤:* 1.输入作者名* 2.输入文件名* 3.输入菜单名* 4.输入文件地址* ============================================* 操…

【技术追踪】DiffuMatting:使用抠图级别注释合成任意对象(ECCV-2024)

万物生&#xff1a;Diffusion与绿幕抠图&#xff0c;影视领域的福音~ 论文&#xff1a;DiffuMatting: Synthesizing Arbitrary Objects with Matting-level Annotation 代码&#xff1a;https://github.com/HUuxiaobin/DiffuMatting &#xff08;即将开源&#xff09; 0、摘要 …

springboot煤炉网站代切系统-计算机毕业设计源码06656

目 录 摘要 1 绪论 1.1 课题目的与意义 1.2国内外研究现状 1.3论文结构与章节安排 1.4 Springboot框架介绍 2 Springboot煤炉网站代切系统系统分析 2.1 可行性分析 2.1.1 技术可行性分析 2.1.2 经济可行性分析 2.1.3 操作可行性分析 2.2 系统功能分析 2.2.1 功能性…

生成随机密码

生成8位无重复的密码&#xff08;可以包含数字、大小写字母&#xff09; import random import string character string.digits string.ascii_letters password .join(random.sample(character, 8)) print(f"生成的随机密码为:{password}")

【Spring Boot】Spring AOP中的环绕通知

目录 一、什么是AOP?二、AOP 的环绕通知2.1 切点以及切点表达式2.2 连接点2.3 通知&#xff08;Advice&#xff09;2.4 切面(Aspect)2.5 不同通知类型的区别2.5.1 正常情况下2.5.2异常情况下 2.6 统一管理切点PointCut 一、什么是AOP? Aspect Oriented Programming&#xff…

Leetcode - 133双周赛

目录 一&#xff0c;3206. 交替组 I 二&#xff0c;3207. 与敌人战斗后的最大分数 三&#xff0c;3208. 交替组 II 四&#xff0c;3209. 子数组按位与值为 K 的数目 一&#xff0c;3206. 交替组 I 直接暴力&#xff0c;代码如下&#xff1a; class Solution {public int n…

【前端项目笔记】9 数据报表

数据报表 效果展示&#xff1a; 在开发代码之前新建分支 git checkout -b report 新建分支report git branch 查看分支 git push -u origin report 将本地report分支推送到云端origin并命名为report 通过路由的形式将数据报表加载到页面中 渲染数据报表基本布局 面包屑导航…

迭代器模式(大话设计模式)C/C++版本

迭代器模式 C #include <iostream> #include <string> #include <vector>using namespace std;// 迭代抽象类,用于定义得到开始对象、得到下一个对象、判断是否到结尾、当前对象等抽象方法&#xff0c;统一接口 class Iterator { public:Iterator(){};virtu…

Miniconda的常见用法——以Isaacgym为例

1. ubuntu24.04安装minicondda mkdir -p ~/miniconda3 wget https://repo.anaconda.com/miniconda/Miniconda3-latest-Linux-x86_64.sh -O ~/miniconda3/miniconda.sh解释下这段代码 bash ~/miniconda3/miniconda.sh -b -u -p ~/miniconda3~/miniconda3/miniconda.sh: 指向Mi…

宝塔面板运行Admin.net框架

准备 宝塔安装 .netcore安装 Admin.net框架发布 宝塔面板设置 完结撒花 1.准备 服务器/虚拟机一台 系统Windows server / Ubuntu20.04&#xff08;本贴使用的是Ubuntu20.04版本系统&#xff09; Admin.net开发框架 先安装好服务器系统&#xff0c;这里就不做安装过程描述了&…

ATA-8035射频功率放大器在声动力疗法中的应用

声动力疗法是一种基于声波能量的治疗方法&#xff0c;广泛应用于医疗和美容领域。它利用高强度聚焦的声波来实现切割、破碎或加热组织&#xff0c;以治疗各种疾病和美容问题。在声动力疗法中&#xff0c;射频功率放大器起着至关重要的作用&#xff0c;它负责提供足够的能量来激…

☺初识c++(语法篇)☺

目录 一命名空间&#xff08;namespace&#xff09;&#xff1a; 二cout与cin简述&#xff1a; 三缺省参数&#xff1a; 四函数重载&#xff1a; 五引用&#xff1a; 六内联函数: 七c中的nullptr简述&#xff1a; 一命名空间&#xff08;namespace&#xff09;&#xff1…

聚焦云技术,探讨 AGI 时代的云原生数据计算系统

6月22日&#xff0c;开源中国社区在上海举办了 OSC 源创会活动&#xff0c;本期活动以「云技术」为主题&#xff0c;邀请了来自华为 openEuler、字节跳动、AutoMQ 等厂商的技术大咖进行分享&#xff0c;拓数派作为云原生数据计算领域的引领者&#xff0c;受邀参与了本次活动&am…

【IMU】 温度零偏标定

温度标定 IMU的零偏随着温度的变化而变化&#xff0c;在全温范围内形状各异&#xff0c;有些可能是单调的&#xff0c;有些可能出现拐点。 多项式误差温度标定 目的是对估计的参数进行温度补偿&#xff0c;获取不同温度时的参数值&#xff08;零偏、尺度、正交&#xff09;&…