WebGL HUD（平视显示器）

news2025/5/23 23:33:37

目录

HUD（平视显示器）

如何实现HUD

示例程序（HUD.html） 

示例程序（HUD.js） 

代码详解 

在网页文字上方显示三维物体

代码详解 

HUD（平视显示器）

平视显示器（head up display）简称HUD，最早用于飞机驾驶。平视显示器将一些重要信息投射到飞机驾驶舱前方的一块玻璃上，飞行员能够将外界的影像和这些重要信息融合在一起，而不用频繁低头观察仪表盘。三维图形程序，尤其是游戏，也经常在三维场景上叠加文本或二维图形信息，以达到HUD的效果。这一节将创建一个示例程序，在三维场景上叠加一些符号和文字，如图10.5所示。

本例的三维部分取自PickObject程序WebGL 选中物体_山楂树の的博客-CSDN博客，额外的工作就是在三维场景前方绘制一个二维的三角形，打印几行文本，显示三维程序中立方体的当前角度。当立方体旋转时，角度变化也会实时地在文本中更新。 

如何实现HUD

可以使用HTML和canvas函数来实现HUD，具体地，我们需要：

1.在HTML文件中，为WebGL绘制的三维图形准备一个＜canvas＞，同时为二维的HUD信息再准备一个＜canvas＞。令这两个＜canvas＞重叠放置，并让HUD的＜canvas＞叠在上面。

2.在前一个＜canvas＞上使用WebGL API绘制三维场景。

3.在后一个＜canvas＞上使用canvas 2D API绘制HUD信息。

如你所见，实现HUD效果的原理非常简单，只要两个＜canvas＞位置重叠，浏览器会自动将WebGL内容和HUD内容混合起来。我们来看一下示例程序。

示例程序（HUD.html） 

对HTML文件做些修改，添加一个＜canvas＞标签。如下显示了HUD.html的代码。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>HUD</title>
  </head>

  <body onload="main()">
    <canvas id="webgl" width="400" height="400" style="position: absolute; z-index: 0">
      Please use a browser that supports "canvas"
    </canvas>
    <canvas id="hud" width="400" height="400" style="position: absolute; z-index: 1"></canvas>

    <script src="../lib/webgl-utils.js"></script>
    <script src="../lib/webgl-debug.js"></script>
    <script src="../lib/cuon-utils.js"></script>
    <script src="../lib/cuon-matrix.js"></script>
    <script src="HUD.js"></script>
  </body>
</html>

＜canvas＞标签的style属性可以用来定义其位置和外观，本例将两个＜canvas＞重叠放置，而且HUD的＜canvas＞叠在上层。style属性信息由名值对组成，属性名和属性值之间用冒号（:）隔开（第9行），比如这样：style=〞position:absolute〞，不同属性间用分号（；）隔开。

position属性表示确定＜canvas＞的位置的方式，z-index属性表示两个＜canvas＞的上下关系。

position属性的值是absolute，表示使用绝对坐标系确定＜canvas＞的位置。我们并没有通过具体的坐标值来指定＜canvas＞的位置，所以两个＜canvas＞都会出现在默认位置上，即页面的左上角，只要二者的大小一样，就完全重合了。z-index属性表示，当两个元素重叠时，哪个在上面哪个在下面。规则是，具有较大的z-index属性值的元素在上面。本例中，HUD的＜canvas＞的z-index值是1，而WebGL的＜canvas＞的z-index值是0，所以前者在上面。

总之，这段HTML代码的意思是，两个＜canvas＞元素重叠放置，HUD的＜canvas＞在WebGL的＜canvas＞的上面。由于在默认情况下，＜canvas＞的背景色是透明的，所以无须做其他处理，用户就能透过HUD的＜canvas＞看到WebGL所渲染的场景。所有在HUD的＜canvas＞中绘制的内容都会出现在WebGL渲染的三维场景之上，这样就产生了HUD效果。

示例程序（HUD.js） 

接下来看一下HUD.js的代码，如下所示。与PickObject相比WebGL 选中物体_山楂树の的博客-CSDN博客，主要有两处区别：

1. 获取了HUD的＜canvas＞的绘图上下文，用来绘制三角形和文本。

2. 将鼠标点击事件响应函数注册到了HUD的＜canvas＞上，前例中是注册到WebGL的＜canvas＞上的。

第1步使用第2章讨论过的知识，在＜canvas＞上绘制了一个三角形。在第2步中，由于HUD的＜canvas＞叠在WebGL的＜canvas＞上面，所以鼠标点击事件是在前者上触发的，需要把事件响应函数注册到前者上。本例的顶点着色器和片元着色器与PickObject.js完全一样。 

// HUD.js (c) 2012 matsuda
// Vertex shader program
var VSHADER_SOURCE =
  'attribute vec4 a_Position;\n' +
  'attribute vec4 a_Color;\n' +
  'uniform mat4 u_MvpMatrix;\n' +
  'uniform bool u_Clicked;\n' + // Mouse is pressed
  'varying vec4 v_Color;\n' +
  'void main() {\n' +
  '  gl_Position = u_MvpMatrix * a_Position;\n' +
  '  if (u_Clicked) {\n' + //  Draw in red if mouse is pressed
  '    v_Color = vec4(1.0, 0.0, 0.0, 1.0);\n' +
  '  } else {\n' +
  '    v_Color = a_Color;\n' +
  '  }\n' +
  '}\n';

// Fragment shader program
var FSHADER_SOURCE =
  '#ifdef GL_ES\n' +
  'precision mediump float;\n' +
  '#endif\n' +
  'varying vec4 v_Color;\n' +
  'void main() {\n' +
  '  gl_FragColor = v_Color;\n' +
  '}\n';

var ANGLE_STEP = 20.0; // Rotation angle (degrees/second)

function main() {
  // Retrieve <canvas> element
  var canvas = document.getElementById('webgl');
  var hud = document.getElementById('hud');

  if (!canvas || !hud) {
    console.log('Failed to get HTML elements');
    return false;
  }

  // Get the rendering context for WebGL
  var gl = getWebGLContext(canvas);
  // Get the rendering context for 2DCG
  var ctx = hud.getContext('2d');
  if (!gl || !ctx) {
    console.log('Failed to get rendering context');
    return;
  }

  // Initialize shaders
  if (!initShaders(gl, VSHADER_SOURCE, FSHADER_SOURCE)) {
    console.log('Failed to intialize shaders.');
    return;
  }

  // Set the vertex information
  var n = initVertexBuffers(gl);
  if (n < 0) {
    console.log('Failed to set the vertex information');
    return;
  }

  // Set the clear color and enable the depth test
  gl.clearColor(0.0, 0.0, 0.0, 1.0);
  gl.enable(gl.DEPTH_TEST);

  // Get the storage locations of uniform variables
  var u_MvpMatrix = gl.getUniformLocation(gl.program, 'u_MvpMatrix');
  var u_Clicked = gl.getUniformLocation(gl.program, 'u_Clicked');
  if (!u_MvpMatrix || !u_Clicked) {
    console.log('Failed to get the storage location of uniform variables');
    return;
  }

  // Calculate the view projection matrix
  var viewProjMatrix = new Matrix4();
  viewProjMatrix.setPerspective(30.0, canvas.width / canvas.height, 1.0, 100.0);
  viewProjMatrix.lookAt(0.0, 0.0, 7.0, 0.0, 0.0, 0.0, 0.0, 1.0, 0.0);

  gl.uniform1i(u_Clicked, 0); // Pass false to u_Clicked

  var currentAngle = 0.0; // Current rotation angle
  // Register the event handler
  hud.onmousedown = function (ev) {   // Mouse is pressed
    var x = ev.clientX, y = ev.clientY;
    var rect = ev.target.getBoundingClientRect();
    if (rect.left <= x && x < rect.right && rect.top <= y && y < rect.bottom) {
      // If pressed position is inside <canvas>, check if it is above object
      var x_in_canvas = x - rect.left, y_in_canvas = rect.bottom - y;
      var picked = check(gl, n, x_in_canvas, y_in_canvas, currentAngle, u_Clicked, viewProjMatrix, u_MvpMatrix);
      if (picked) alert('The cube was selected! ');
    }
  }

  var tick = function () {   // Start drawing
    currentAngle = animate(currentAngle);
    draw2D(ctx, currentAngle); // Draw 2D
    draw(gl, n, currentAngle, viewProjMatrix, u_MvpMatrix);
    requestAnimationFrame(tick, canvas);
  };
  tick();
}

function initVertexBuffers(gl) {
  // Create a cube
  //    v6----- v5
  //   /|      /|
  //  v1------v0|
  //  | |     | |
  //  | |v7---|-|v4
  //  |/      |/
  //  v2------v3
  var vertices = new Float32Array([   // Vertex coordinates
    1.0, 1.0, 1.0, -1.0, 1.0, 1.0, -1.0, -1.0, 1.0, 1.0, -1.0, 1.0,    // v0-v1-v2-v3 front
    1.0, 1.0, 1.0, 1.0, -1.0, 1.0, 1.0, -1.0, -1.0, 1.0, 1.0, -1.0,    // v0-v3-v4-v5 right
    1.0, 1.0, 1.0, 1.0, 1.0, -1.0, -1.0, 1.0, -1.0, -1.0, 1.0, 1.0,    // v0-v5-v6-v1 up
    -1.0, 1.0, 1.0, -1.0, 1.0, -1.0, -1.0, -1.0, -1.0, -1.0, -1.0, 1.0,    // v1-v6-v7-v2 left
    -1.0, -1.0, -1.0, 1.0, -1.0, -1.0, 1.0, -1.0, 1.0, -1.0, -1.0, 1.0,    // v7-v4-v3-v2 down
    1.0, -1.0, -1.0, -1.0, -1.0, -1.0, -1.0, 1.0, -1.0, 1.0, 1.0, -1.0     // v4-v7-v6-v5 back
  ]);

  var colors = new Float32Array([   // Colors
    0.2, 0.58, 0.82, 0.2, 0.58, 0.82, 0.2, 0.58, 0.82, 0.2, 0.58, 0.82, // v0-v1-v2-v3 front
    0.5, 0.41, 0.69, 0.5, 0.41, 0.69, 0.5, 0.41, 0.69, 0.5, 0.41, 0.69,  // v0-v3-v4-v5 right
    0.0, 0.32, 0.61, 0.0, 0.32, 0.61, 0.0, 0.32, 0.61, 0.0, 0.32, 0.61,  // v0-v5-v6-v1 up
    0.78, 0.69, 0.84, 0.78, 0.69, 0.84, 0.78, 0.69, 0.84, 0.78, 0.69, 0.84, // v1-v6-v7-v2 left
    0.32, 0.18, 0.56, 0.32, 0.18, 0.56, 0.32, 0.18, 0.56, 0.32, 0.18, 0.56, // v7-v4-v3-v2 down
    0.73, 0.82, 0.93, 0.73, 0.82, 0.93, 0.73, 0.82, 0.93, 0.73, 0.82, 0.93, // v4-v7-v6-v5 back
  ]);

  // Indices of the vertices
  var indices = new Uint8Array([
    0, 1, 2, 0, 2, 3,    // front
    4, 5, 6, 4, 6, 7,    // right
    8, 9, 10, 8, 10, 11,    // up
    12, 13, 14, 12, 14, 15,    // left
    16, 17, 18, 16, 18, 19,    // down
    20, 21, 22, 20, 22, 23     // back
  ]);

  // Write the vertex property to buffers (coordinates and normals)
  if (!initArrayBuffer(gl, vertices, 3, gl.FLOAT, 'a_Position')) return -1; // Coordinates
  if (!initArrayBuffer(gl, colors, 3, gl.FLOAT, 'a_Color')) return -1;      // Color Information

  // Create a buffer object
  var indexBuffer = gl.createBuffer();
  if (!indexBuffer) {
    return -1;
  }
  // Write the indices to the buffer object
  gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, indexBuffer);
  gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, indices, gl.STATIC_DRAW);

  return indices.length;
}

function check(gl, n, x, y, currentAngle, u_Clicked, viewProjMatrix, u_MvpMatrix) {
  var picked = false;
  gl.uniform1i(u_Clicked, 1);  // Pass true to u_Clicked(Draw cube with red)
  draw(gl, n, currentAngle, viewProjMatrix, u_MvpMatrix);
  // Read pixel at the clicked position
  var pixels = new Uint8Array(4); // Array for storing the pixel value
  gl.readPixels(x, y, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, pixels);

  if (pixels[0] == 255) // If red = 255, clicked on cube
    picked = true;

  gl.uniform1i(u_Clicked, 0);  // Pass false to u_Clicked(Draw cube with specified color)
  draw(gl, n, currentAngle, viewProjMatrix, u_MvpMatrix);

  return picked;
}

var g_MvpMatrix = new Matrix4(); // Model view projection matrix
function draw(gl, n, currentAngle, viewProjMatrix, u_MvpMatrix) {
  // Caliculate The model view projection matrix and pass it to u_MvpMatrix
  g_MvpMatrix.set(viewProjMatrix);
  g_MvpMatrix.rotate(currentAngle, 1.0, 0.0, 0.0); // Rotate appropriately
  g_MvpMatrix.rotate(currentAngle, 0.0, 1.0, 0.0);
  g_MvpMatrix.rotate(currentAngle, 0.0, 0.0, 1.0);
  gl.uniformMatrix4fv(u_MvpMatrix, false, g_MvpMatrix.elements);
  gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);     // Clear buffers (color and depth)
  gl.drawElements(gl.TRIANGLES, n, gl.UNSIGNED_BYTE, 0);   // Draw
}

function draw2D(ctx, currentAngle) {
  ctx.clearRect(0, 0, 400, 400); // Clear <hud>
  // Draw triangle with white lines
  ctx.beginPath();                      // Start drawing
  ctx.moveTo(120, 10); ctx.lineTo(200, 150); ctx.lineTo(40, 150);
  ctx.closePath();
  ctx.strokeStyle = 'rgba(255, 255, 255, 1)'; // Set white to color of lines
  ctx.stroke();                           // Draw Triangle with white lines
  // Draw white letters
  ctx.font = '18px "Times New Roman"';
  ctx.fillStyle = 'rgba(255, 255, 255, 1)'; // Set white to the color of letters
  ctx.fillText('HUD: Head Up Display', 40, 180);
  ctx.fillText('Triangle is drawn by Canvas 2D API.', 40, 200);
  ctx.fillText('Cube is drawn by WebGL API.', 40, 220);
  ctx.fillText('Current Angle: ' + Math.floor(currentAngle), 40, 240);
}

var last = Date.now(); // Last time that this function was called
function animate(angle) {
  var now = Date.now();   // Calculate the elapsed time
  var elapsed = now - last;
  last = now;
  // Update the current rotation angle (adjusted by the elapsed time)
  var newAngle = angle + (ANGLE_STEP * elapsed) / 1000.0;
  return newAngle % 360;
}

function initArrayBuffer(gl, data, num, type, attribute) {
  // Create a buffer object
  var buffer = gl.createBuffer();
  if (!buffer) {
    console.log('Failed to create the buffer object');
    return false;
  }
  // Write date into the buffer object
  gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
  gl.bufferData(gl.ARRAY_BUFFER, data, gl.STATIC_DRAW);
  // Assign the buffer object to the attribute variable
  var a_attribute = gl.getAttribLocation(gl.program, attribute);
  if (a_attribute < 0) {
    console.log('Failed to get the storage location of ' + attribute);
    return false;
  }
  gl.vertexAttribPointer(a_attribute, num, type, false, 0, 0);
  // Enable the assignment of the buffer object to the attribute variable
  gl.enableVertexAttribArray(a_attribute);
  // Unbind the buffer object
  gl.bindBuffer(gl.ARRAY_BUFFER, null);

  return true;
}

代码详解 

由于程序是顺序执行的，我们先来看一下main（）函数（第30行）。首先，获取HUD的＜canvas＞元素（第33行）及其绘图上下文（第43行）。然后，在HUD的＜canvas＞元素上注册鼠标事件响应函数，该函数在PickObject.js中是注册到WebGL的＜canvas＞上的。这是因为HUD的＜canvas＞叠在WebGL的＜canvas＞上面，鼠标点击事件是在HUD的＜canvas＞上触发的。

tick（）函数不仅需要调用draw（）函数绘制三维场景（第96行），还要调用draw2D（）函数绘制HUD信息（第95行）。

draw2D（）函数接收两个参数，二维绘图上下文ctx和立方体的当前角度currentAngle（第184行）。该函数首先调用clearRect（）方法，传入＜canvas＞的左上角坐标、宽度和高度，清空绘图区；然后绘制了一个空心的三角形：定义路径，指定颜色，并调用stroke（）方法完成绘制（第187～191行）；接着，绘制了一些文本：同样指定字体和颜色，并调用fillText（）方法完成绘制（第193～198行）。fillText（）函数接收三个参数，第1个参数是将要绘制的文本字符串，第2个和第3个参数绘制文本位置的x和y坐标。最后一行文本还显示了立方体的当前角度currentAngle，我们用Math.floor（）方法截去了其小数部分。注意，和WebGL的＜canvas＞一样，HUD的＜canvas＞也需要在每一帧重绘，因为当前的角度一直在变化。

在网页文字上方显示三维物体

如果了解了实现HUD效果的原理，那么在网页上方显示三维物体就非常简单了。示例程序3DoverWeb把用来实现WebGL绘图的＜canvas＞叠置于网页上方，同时设置背景色为透明，程序的运行效果如下图所示。

代码详解 

3DoverWeb.js几乎与PickObject.js完全相同，只有一处很小的改动，就是将背景色的α值从1.0改为0.0（第55行）。 

将背景颜色的值设为0.0，WebGL ＜canvas＞就会变成透明的，用户就可以透过它看到网页上的内容。你也可以试试将该α值改成0.0和1.0之间的某个值，＜canvas＞就会变成半透明的。 

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

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

第3章 MongoDB数据库操作＜练习＞

第3章 MongoDB数据库操作＜练习＞

1. 创建数据库&#xff0c;名为zhangsan &#xff08;zhangsan修改为自己的姓名全 拼&#xff09; use wuweixian db.createCollection("wwx") 2. 批量插入多条文章评论用于测试 db.wwx.insertMany([ {"_id":"1","articleid":"…
阅读更多...
沉降安全监测之静力水准仪安装与精度分析

沉降安全监测之静力水准仪安装与精度分析

静力水准仪的安装使用步骤如下&#xff1a; 1、选择合适的安装位置&#xff1a;静力水准仪应该安装在平稳且不易受到外力影响的地面上&#xff0c;以确保测量结果的准确性。同时&#xff0c;应避免安装在有风的地方&#xff0c;因为风会影响水准仪的读数。 2、安装支架&#…
阅读更多...
基于矩阵分解算法的智能Steam游戏AI推荐系统——深度学习算法应用(含python、ipynb工程源码)+数据集（四）

基于矩阵分解算法的智能Steam游戏AI推荐系统——深度学习算法应用(含python、ipynb工程源码)+数据集（四）

目录 前言总体设计系统整体结构图系统流程图 运行环境模块实现1. 数据预处理2. 模型构建1&#xff09;定义模型结构2&#xff09;优化损失函数 3. 模型训练及保存1&#xff09;模型训练2&#xff09;模型保存 4. 模型应用1&#xff09;制作页面2&#xff09;模型导入及调用3&am…
阅读更多...
MongoDB（一） windows 和 linux 之 Ubuntu 安装

MongoDB（一） windows 和 linux 之 Ubuntu 安装

数据库分类 一、关系型数据库&#xff08;RDBMS&#xff09; mysql 、Oracle、DB2、SQL Server 关系数据库中全都是表 二、非关系型数据库&#xff08;NO SQL&#xff09; MongoDB、Redis 键值对数据库 文档数据库MongoDB 下载 mongoDB https://www.mongodb.com/try/downloa…
阅读更多...
DA1--用pandas查看网站用户数据

DA1--用pandas查看网站用户数据

目录 1.题目描述 2.输入描述 3.输出描述 4.题目分析 5.通过代码 1.题目描述 现有一个Nowcoder.csv文件&#xff0c;它记录了牛客网的部分用户数据&#xff0c;包含如下字段&#xff08;字段与字段之间以逗号间隔&#xff09;&#xff1a; Nowcoder_ID&#xff1a;用户ID …
阅读更多...
软件项目开发的流程及关键点

软件项目开发的流程及关键点

软件项目开发的流程及关键点 graph LR A[需求分析] --> B[系统设计] B --> C[编码开发] C --> D[测试验证] D --> E[部署上线] E --> F[运维支持]在项目开发的流程中&#xff0c;首先是进行需求分析&#xff0c;明确项目的目标和功能要求。接下来是系统设计&am…
阅读更多...
计算机竞赛 深度学习+opencv+python实现车道线检测 - 自动驾驶

计算机竞赛 深度学习+opencv+python实现车道线检测 - 自动驾驶

文章目录 0 前言1 课题背景2 实现效果3 卷积神经网络3.1卷积层3.2 池化层3.3 激活函数&#xff1a;3.4 全连接层3.5 使用tensorflow中keras模块实现卷积神经网络 4 YOLOV56 数据集处理7 模型训练8 最后 0 前言 &#x1f525; 优质竞赛项目系列&#xff0c;今天要分享的是 &am…
阅读更多...
❤Uniapp报npx update-browserslist-db@latest

❤Uniapp报npx update-browserslist-db@latest

❤ Uniapp报npx update-browserslist-dblatest 按照提示先更新一下 npx update-browserslist-dblatest然后打开一下端口
阅读更多...
signal(SIGPIPE, SIG_IGN)

signal(SIGPIPE, SIG_IGN)

linux查看signal常见信号。 [rootplatform:]# kill -l1) HUP2) INT3) QUIT4) ILL5) TRAP6) ABRT7) BUS8) FPE9) KILL 10) USR1 11) SEGV 12) USR2 13) PIPE 14) ALRM 15) TERM 16) STKFLT 17) CHLD 18) CONT 19) STOP 20) TSTP 21) TTIN 22) TTOU 23) URG 24) XCPU 25) XFSZ 2…
阅读更多...
使用Python进行供应链分析

使用Python进行供应链分析

供应链是生产和向客户交付货物所涉及的生产和物流网络。供应链分析是指分析供应链的各个组成部分&#xff0c;以了解如何提高供应链的有效性&#xff0c;为客户创造更多价值。所以&#xff0c;如果你想学习如何分析供应链&#xff0c;这篇文章是给你的。文章中&#xff0c;将带…
阅读更多...
滑动窗口训练9.21

滑动窗口训练9.21

好久没有写博客了&#xff0c;自从上半年蓝桥杯结束后&#xff0c;就有点懈怠了 最近两三周才又慢慢刷起题来&#xff0c;也顺便记录下自己的成长&#xff01; 今天是滑动窗口的章节&#xff0c;前两周刷了字符串、双指针、模拟。这些板块我都在leetcode上找了些题&#xff0…
阅读更多...
【大学英语视听说上】Topic Presentation

【大学英语视听说上】Topic Presentation

&#xff08;一些视听说的必要作业...&#xff09; 展示&#xff0c;每人准备ppt文件&#xff0c;时长五分钟&#xff0c;第一分钟自我介绍&#xff0c;之后四分钟介绍一个主题。 例如&#xff1a;中秋节&#xff0c;英国地标建筑等等。 要求图文并茂&#xff0c;发音清楚标…
阅读更多...
Intel汇编在VS下开发的环境配置

Intel汇编在VS下开发的环境配置

1. 创建一个C/C的空项目 2. 创建汇编源码文件, 就是C文件改后缀为asm 3. 在生成依赖项一栏中选择自定义 4. 选择masm 5. 在源文件上右击选择属性 6. 这么设置一下 7. 为了让代码看的更舒服一些, 添加一些高亮插件 8. 安装AsmHighligher和AsmDude插件(非必须), 其中前者主要是高…
阅读更多...
RK3568驱动指南｜第五期-中断-

RK3568驱动指南｜第五期-中断-

瑞芯微RK3568芯片是一款定位中高端的通用型SOC&#xff0c;采用22nm制程工艺&#xff0c;搭载一颗四核Cortex-A55处理器和Mali G52 2EE 图形处理器。RK3568 支持4K 解码和 1080P 编码&#xff0c;支持SATA/PCIE/USB3.0 外围接口。RK3568内置独立NPU&#xff0c;可用于轻量级人工…
阅读更多...
债券风险价值类

债券风险价值类

声明 本文是学习GB-T 42815-2023 债券价格指标产品描述规范. 而整理的学习笔记,分享出来希望更多人受益,如果存在侵权请及时联系我们 1 范围 本文件规定了债券价格指标产品各要素的定义、范围、框架及输出口径。 本文件适用于债券价格指标产品的编制发布机构及使用机构。 …
阅读更多...
Rsync学习笔记1

Rsync学习笔记1

企业架构Web服务器的文件及时同步&#xff1a; 1&#xff09;能够理解为何要服务器的文件同步&#xff1b; 2&#xff09;能够简单描述实现文件同步的几种方式&#xff1b; 3&#xff09;能够实现服务器文件实时同步的案例&#xff1b; 服务器同步文件的必要性&#xff1a; …
阅读更多...
求二维子数组的和（剖析）

求二维子数组的和（剖析）

文章目录 &#x1f412;个人主页&#x1f3c5;JavaSE系列专栏&#x1f4d6;前言&#xff1a;本篇剖析一下二维子数组求和规则&#xff1a; &#x1f412;个人主页 &#x1f3c5;JavaSE系列专栏 &#x1f4d6;前言&#xff1a;本篇剖析一下二维子数组求和 规则&#xff1a; 这…
阅读更多...
阿里员工曝光，跳槽提供流水，将28K改成38K，成功率高吗？

阿里员工曝光，跳槽提供流水，将28K改成38K，成功率高吗？

在这位员工的曝光中&#xff0c;他声称通过提供虚假简历&#xff0c;将自己的工作经验和技能水平夸大&#xff0c;以获得更高的薪资。此外&#xff0c;他还提供了虚假的流水&#xff0c;使自己的收入看起来更高。然而&#xff0c;这一行为无疑是违反道德和诚信原则的&#xff0…
阅读更多...
向表中针对全部列插入数据

向表中针对全部列插入数据

MySQL从小白到总裁完整教程目录:https://blog.csdn.net/weixin_67859959/article/details/129334507?spm1001.2014.3001.5502 语法格式: insert into 表名 values(); 我们来查看test01表里面有几列 mysql> show databases; -------------------- | Database …
阅读更多...
学习记忆——宫殿篇——记忆宫殿——记忆桩——学校

学习记忆——宫殿篇——记忆宫殿——记忆桩——学校

教室 桶 走道 桌子 暖气 窗台 后背 窗帘 监视器 白盒子 教师 讲台 表 投影仪 音响 窗 喇叭 黑板 门 栏杆 椅子 食堂 桶 刷卡器 柱子 桌子 风扇 灯罩 一列椅子 地面 大门空间 电视 活动室 盘子 纸盒 油桶 称 水桶 展牌 帘子 消防栓 毯子 储物箱 宿舍 梯子 坐垫 挂件 吊兰 君子…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023