绘制拖拽html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>拖拽绘制矩形框 - 可移动可调整大小</title>
<style>body, html {margin: 0; padding: 0; height: 100%;user-select: none;}#container {position: relative;width: 100vw;height: 100vh;background-color: #f0f0f0;border: 1px solid #ccc;overflow: hidden;}.rectangle {position: absolute;border: 2px solid;background-color: rgba(0, 123, 255, 0.2);cursor: move;box-sizing: border-box;}.delete-btn {position: absolute;top: -8px;right: -8px;width: 16px;height: 16px;background: #ff4d4f;color: white;font-weight: bold;font-size: 12px;line-height: 16px;text-align: center;border-radius: 50%;cursor: pointer;user-select: none;z-index: 1000;pointer-events: auto;}.resize-handle {position: absolute;width: 10px;height: 10px;background: white;border: 2px solid #007bff;box-sizing: border-box;z-index: 10;}.resize-handle.nw { top: -6px; left: -6px; cursor: nwse-resize; }.resize-handle.ne { top: -6px; right: -6px; cursor: nesw-resize; }.resize-handle.sw { bottom: -6px; left: -6px; cursor: nesw-resize; }.resize-handle.se { bottom: -6px; right: -6px; cursor: nwse-resize; }#info {position: fixed;bottom: 10px;left: 10px;max-height: 150px;overflow-y: auto;background: rgba(255,255,255,0.9);border: 1px solid #ccc;padding: 8px;font-family: monospace;font-size: 14px;width: 320px;}
</style>
</head>
<body>
<div id="container"></div>
<div id="info"><strong>绘制的矩形框信息:</strong><br/></div>
<script>(function() {const container = document.getElementById('container');const info = document.getElementById('info');let startX = 0;let startY = 0;let currentRect = null;let rectangles = [];let dragData = null; // {rect, startX, startY, origX, origY}let resizeData = null; // {rect, handle, startX, startY, origX, origY, origW, origH}const colors = ['#007bff', '#28a745', '#dc3545', '#ffc107', '#17a2b8','#6f42c1', '#e83e8c', '#fd7e14', '#20c997', '#6610f2'];function getRelativePosition(clientX, clientY) {const rect = container.getBoundingClientRect();return {x: clientX - rect.left,y: clientY - rect.top};}function updateInfoLine(rect) {if (!rect._infoLine) return;const x = parseFloat(rect.style.left);const y = parseFloat(rect.style.top);const w = parseFloat(rect.style.width);const h = parseFloat(rect.style.height);rect._infoLine.textContent = `矩形框 ${rectangles.indexOf(rect) + 1}: x=${Math.round(x)}, y=${Math.round(y)}, 宽=${Math.round(w)}, 高=${Math.round(h)}`;}function createResizeHandle(position) {const handle = document.createElement('div');handle.className = 'resize-handle ' + position;return handle;}container.addEventListener('mousedown', (e) => {if (e.button !== 0) return; // only left mouse buttonconst target = e.target;// 如果点击的是删除按钮if (target.classList.contains('delete-btn')) {return; // 由其自身的监听器处理}// 如果点击的是调整大小的控制点if (target.classList.contains('resize-handle')) {const rect = target.parentElement;const pos = getRelativePosition(e.clientX, e.clientY);resizeData = {rect,handle: target.classList[1], // nw, ne, sw, sestartX: pos.x,startY: pos.y,origX: parseFloat(rect.style.left),origY: parseFloat(rect.style.top),origW: parseFloat(rect.style.width),origH: parseFloat(rect.style.height)};e.preventDefault();return;}// 如果点击的是已有的矩形（非删除或调整大小）if (target.classList.contains('rectangle')) {const rect = target;const pos = getRelativePosition(e.clientX, e.clientY);dragData = {rect,startX: pos.x,startY: pos.y,origX: parseFloat(rect.style.left),origY: parseFloat(rect.style.top)};e.preventDefault();return;}// 否则，开始绘制新的矩形const pos = getRelativePosition(e.clientX, e.clientY);startX = pos.x;startY = pos.y;currentRect = document.createElement('div');currentRect.className = 'rectangle';// 颜色循环分配const color = colors[rectangles.length % colors.length];currentRect.style.borderColor = color;currentRect.style.backgroundColor = color + '33'; // 20% 透明度currentRect.style.left = startX + 'px';currentRect.style.top = startY + 'px';currentRect.style.width = '0px';currentRect.style.height = '0px';container.appendChild(currentRect);rectangles.push(currentRect);// 创建信息行元素const infoLine = document.createElement('div');infoLine.style.display = 'flex';infoLine.style.alignItems = 'center';infoLine.style.marginBottom = '4px';// 创建文本节点，显示矩形信息const infoText = document.createElement('span');infoText.textContent = `矩形框 ${rectangles.length}: x=0, y=0, 宽=0, 高=0`;infoLine.appendChild(infoText);// 创建删除按钮const infoDeleteBtn = document.createElement('button');infoDeleteBtn.textContent = '删除';infoDeleteBtn.style.marginLeft = '10px';infoDeleteBtn.style.cursor = 'pointer';infoDeleteBtn.style.padding = '2px 6px';infoDeleteBtn.style.border = '1px solid #ccc';infoDeleteBtn.style.backgroundColor = '#f8f9fa';infoDeleteBtn.style.borderRadius = '4px';infoDeleteBtn.style.fontSize = '12px';infoDeleteBtn.style.color = '#333';infoDeleteBtn.style.userSelect = 'none';// 删除按钮点击事件，删除对应矩形和信息行(function(rect, line) {infoDeleteBtn.addEventListener('click', function() {// 删除对应矩形元素if (container.contains(rect)) {container.removeChild(rect);}// 删除对应信息行if (info.contains(line)) {info.removeChild(line);}// 从数组中移除对应矩形const index = rectangles.indexOf(rect);if (index > -1) {rectangles.splice(index, 1);}});})(currentRect, infoLine);// 将删除按钮添加到信息行infoLine.appendChild(infoDeleteBtn);// 将信息行添加到info面板info.appendChild(infoLine);// 存储引用以便后续更新和删除currentRect._infoLine = infoText;e.preventDefault();});container.addEventListener('mousemove', (e) => {const pos = getRelativePosition(e.clientX, e.clientY);// 处理调整大小if (resizeData) {const {rect, handle, startX, startY, origX, origY, origW, origH} = resizeData;let newX = origX;let newY = origY;let newW = origW;let newH = origH;const dx = pos.x - startX;const dy = pos.y - startY;switch (handle) {case 'nw':newX = origX + dx;newY = origY + dy;newW = origW - dx;newH = origH - dy;break;case 'ne':newY = origY + dy;newW = origW + dx;newH = origH - dy;break;case 'sw':newX = origX + dx;newW = origW - dx;newH = origH + dy;break;case 'se':newW = origW + dx;newH = origH + dy;break;}// 防止宽高为负if (newW < 10) newW = 10;if (newH < 10) newH = 10;if (newX < 0) newX = 0;if (newY < 0) newY = 0;if (newX + newW > container.clientWidth) newX = container.clientWidth - newW;if (newY + newH > container.clientHeight) newY = container.clientHeight - newH;rect.style.left = newX + 'px';rect.style.top = newY + 'px';rect.style.width = newW + 'px';rect.style.height = newH + 'px';updateInfoLine(rect);e.preventDefault();return;}// 处理拖拽if (dragData) {const {rect, startX, startY, origX, origY} = dragData;let newX = origX + (pos.x - startX);let newY = origY + (pos.y - startY);// 保持在容器内if (newX < 0) newX = 0;if (newY < 0) newY = 0;if (newX + rect.clientWidth > container.clientWidth) newX = container.clientWidth - rect.clientWidth;if (newY + rect.clientHeight > container.clientHeight) newY = container.clientHeight - rect.clientHeight;rect.style.left = newX + 'px';rect.style.top = newY + 'px';updateInfoLine(rect);e.preventDefault();return;}// 处理绘制新矩形if (!currentRect) return;const x = Math.min(pos.x, startX);const y = Math.min(pos.y, startY);const width = Math.abs(pos.x - startX);const height = Math.abs(pos.y - startY);currentRect.style.left = x + 'px';currentRect.style.top = y + 'px';currentRect.style.width = width + 'px';currentRect.style.height = height + 'px';updateInfoLine(currentRect);e.preventDefault();});container.addEventListener('mouseup', (e) => {if (currentRect) {currentRect = null;e.preventDefault();}if (dragData) {dragData = null;e.preventDefault();}if (resizeData) {resizeData = null;e.preventDefault();}});container.addEventListener('mouseleave', (e) => {if (currentRect) {currentRect = null;}if (dragData) {dragData = null;}if (resizeData) {resizeData = null;}});// 监听容器子元素变化，给新矩形添加调整大小控制点const observer = new MutationObserver(mutations => {mutations.forEach(mutation => {mutation.addedNodes.forEach(node => {if (node.classList && node.classList.contains('rectangle')) {['nw', 'ne', 'sw', 'se'].forEach(pos => {const handle = createResizeHandle(pos);node.appendChild(handle);});}});});});observer.observe(container, { childList: true });})();
</script>
</body>
</html>
相关文章：
绘制拖拽html
<!DOCTYPE html> <html lang"zh-CN"> <head> <meta charset"UTF-8" /> <meta name"viewport" content"widthdevice-width, initial-scale1" /> <title>拖拽绘制矩形框 - 可移动可调整大小</ti…...
OpenCV计算机视觉实战（3）——计算机图像处理基础
OpenCV计算机视觉实战（3）——计算机图像处理基础 0. 前言1. 像素和图像表示1.1 像素 2. 色彩空间2.1 原色2.2 色彩空间2.3 像素和色彩空间 3. 文件类型3.1 图像文件类型3.2 视频文件3.3 图像与视频 4. 计算机图像编程简史5. OpenCV 概述小结系列链接 0. …...
)
零基础学Java——第九章：数据库编程(三)
第九章：数据库编程 - ORM框架（下） 在上一部分中，我们学习了ORM框架的基础知识和Hibernate框架。在这一部分中，我们将继续学习其他流行的ORM框架，包括MyBatis和Spring Data JPA。 1. MyBatis框架 1.1 MyB…...
Linux/AndroidOS中进程间的通信线程间的同步 - 信号量
1 概述 本文将介绍 POSIX 信号量，它允许进程和线程同步对共享资源的访问。有两种类型的 POSIX 信号量： 命名信号量：这种信号量拥有一个名字。通过使用相同的名字调用 sem_open()，不相关的进程能够访问同一个信号量。未命名信号量…...
精益数据分析（46/126）：深入剖析用户生成内容（UGC）商业模式
精益数据分析（46/126）：深入剖析用户生成内容（UGC）商业模式 在创业与数据分析的征程中，每一种商业模式都蕴含着独特的价值与挑战。今天，我们依旧怀揣着共同进步的信念，深入研读《精益…...
vue +xlsx+exceljs 导出excel文档
实现功能：分标题行导出数据过多，一个sheet表里表格条数有限制，需要分sheet显示。 步骤1:安装插件包 npm install exceljs npm install xlsx 步骤2：引用包 import XLSX from xlsx; import ExcelJS from exceljs; 步骤3&am…...
Android 10.0 SharedPreferences in credential encrypted storage are not avai
1.前言 在10.0的系统rom定制化开发中，在开机的过程中，由于某些应用在开机解锁阶段就开始访问查询短信和联系人等功能，所以 会出现抛异常的情况出现，接下来分析下相关的情况，然后来解决这些问题 2.SharedPreferences in credential encrypted storage are not available …...
面试高频算法：最长回文子串
题目：5. 最长回文子串 给你一个字符串 s，找到 s 中最长的回文子串。 回文：如果字符串向前和向后读都相同，则它满足回文性；子串：子字符串 是字符串中连续的非空字符序列。 示例 1： 输入&…...
RDK X5 交叉编译OSS\QT\opencv\openssl
RDK X5 交叉编译环境配置 1 资源2 使用vm安装Ubuntu22.043 安装依赖4 安装ide5 下载交叉编译工具6 编译oss库6.1 设置临时环境变量6.2 编译arm版本的openssl6.2 编译arm版本的curl6.1 下载oss源码6.1.1 创建arm-toolchain.cmake6.1.2 修改CMakeLists.txt6.1.3 编译 7 编译openc…...
Python cv2边缘检测与轮廓查找：从理论到实战
在计算机视觉领域，边缘检测与轮廓查找是图像分析的核心技术。本文将结合OpenCV库（cv2模块），从理论原理到代码实战，系统讲解如何通过Python实现这两个关键操作。 一、基础概念解析 1.1 边缘检测的本质 边缘是图像中灰…...
5月7日星期三今日早报简报微语报早读
5月7日星期三，农历四月初十，早报#微语早读。 1、1101名优秀运动员拟保送，全红婵、黄雨婷、盛李豪在列； 2、世界羽联主席巴达玛：中国组织赛事的能力无与伦比； 3、中国首位、亚洲首位！赵心童夺…...
智慧医院的可视化变革：可视化工具助力数字化转型
在科技飞速发展的当下，智慧医院已从概念逐步落地，深刻改变着传统医疗模式。它借助互联网、数字孪生及人工智能等前沿技术，在医疗服务领域掀起革新，涵盖面向医务人员的“智慧医疗”、面向患者的“智慧服务”以及面向医院的“智慧管…...
python+open3d选择点云上的某个点并获取其对应三维坐标
👑主页：吾名招财 👓简介：工科学硕，研究方向机器视觉，爱好较广泛… 💫签名：面朝大海，春暖花开！ python+open3d选择点云上的某个点并获取其对应三维坐标 1，引言2，效果展示3，点云获取4，程序1，引言 有时候我们只想在点云上获取某个目标的具体坐标，通过程序根据…...
ROS第十三梯：RViz+Marker——自定义几何形状可视化
1）概述 在ROS（Robot Operating System）中，Marker是一种用于在RViz（Robot Visualization）中显示自定义几何形状和注释的工具。Marker是通过visualization_msgs/Marker消息类型发布的。可以在RViz中以各种形式（如点、线、文本、立方体等）显示数据。 2）主要消息格…...
Java高频面试之并发编程-13
hello啊，各位观众姥爷们！！！本baby今天又来报道了！哈哈哈哈哈嗝🐶 面试官：详解原子性、可见性、有序性 在并发编程中，原子性（Atomicity）、可见性（…...
WSL 的 Ubuntu 子系统中启用图形化界面
sudo chmod w /home sudo apt update sudo apt install cifs-utils 1. 选择合适的 X 服务器 在 Windows 系统上，需要安装一个 X 服务器来处理 WSL 中 Ubuntu 的图形显示。常用的 X 服务器有 VcXsrv 和 X410，这里以 VcXsrv 为例： 从VcXsrv 官…...
项目模拟实现消息队列第二天
消息应答的模式 1.自动应答: 消费者把这个消息取走了，就算是应答了（相当于没有应答) 2.手动应答: basicAck方法属于手动应答(消费者需要主动调用这个api进行应答) 小结 1.需要实现生产者,broker server，消费者这三个部分的 2.针对生产者和消费…...
MySQL OCP和Oracle OCP怎么选？
近期oracle 为庆祝 MySQL 数据库发布 30 周年，Oracle 官方推出限时福利：2025 年 4 月 20 日至 7 月 31 日期间，所有人均可免费报考 MySQL OCP（Oracle Certified Professional）认证考试（具体可查看MySQL OCP…...
SR触发器为什么能够消抖
SR触发器（Set-Reset触发器）能够用于**消抖（Debounce）**，主要是因为它的双稳态特性和对输入信号的锁定能力。机械开关（如按键、拨动开关）在闭合或断开时，由于金属触点的弹性ÿ…...
2025ISCC练武校级赛部分题解WP
Web 战胜卞相壹 <!-- 路过的酒罐王柯洁九段说： --> <!-- 会叠棋子有什么用！你得在棋盘内战胜他！我教你个定式，要一直记得！一直！ --> <!-- SGF B[ae];B[ce];B[df];B[cg];B[ag];B[ai];B[ci];…...
Microsoft Azure 在印度尼西亚区域正式上线
微软正式宣布，其首个落地印度尼西亚的云区域——Indonesia Central 已全面上线并正式投入使用！这一区域精心设置了三个可用性区（Availability Zones），每个可用性区均配备独立的电源、冷却系统以及网络设施，…...
day18 python聚类分析对数据集模型性能影响
聚类后的分析：推断簇的类型 知识点回顾： 推断簇含义的2个思路：先选特征和后选特征通过可视化图形借助ai定义簇的含义科研逻辑闭环:通过精度判断特征工程价值 作业：参考示例代码对心脏病数据集采取类似操作，并且评估特征…...
vue3的新特性
vue2 data属性和方法名散落于各个位置，量大了不好找 顺序变了，script在最前面 setup vue3中不用this，setup的执行时期比beforeCreate还要早，所以不要用this setup中写代码的特点 必须要有return，才能在上面使用 什么…...
NX二次开发——BlockUI 弹出另一个BlockUI对话框
最近在研究，装配体下自动导出BOM表格中需要用到BlockUI 弹出另一个BlockUI对话框。通过对网上资料进行整理总结，具体如下： 1、明确主对话框、子对话框1和子对话框2 使用BlockUI创建.cpp和.hpp文件，dlx文件内容如下所示 主对话框…...
《Overlapping Experiment Infrastructure: More, Better, Faster》论文阅读笔记
文章目录 1 背景2 三个核心概念3 Launch层：特性发布的专用机制4 流量分发策略和条件筛选4.1 四种流量分发类型4.2 条件筛选机制 5 工具链与监控体系6 实验设计原则7 培训参考与推荐 1 背景 谷歌（Google）以数据驱动著称，几乎所有可…...
【Machine Learning Q and AI 读书笔记】- 05 利用数据减少过拟合现象
Machine Learning Q and AI 中文译名 大模型技术30讲，主要总结了大模型相关的技术要点，结合学术和工程化，对LLM从业者来说，是一份非常好的学习实践技术地图. 本文是Machine Learning Q and AI 读书笔记的第5篇，对应原…...
前端面试测试题目（一）
一、Vue的双向绑定机制（v-model底层实现原理） Vue的双向绑定核心由 响应式系统 和 指令语法糖 共同实现，具体原理如下： 响应式系统 Vue通过数据劫持和依赖收集实现数据变化到视图的同步： • 数据劫持：在Vue…...
最优化方法Python计算：无约束优化应用——线性回归分类器
一、线性回归分类器 假设样本数据为 ( x i , y i ) (\boldsymbol{x}_i, y_i) (xi,yi)，其中 i 1 , 2 , … , m i 1, 2, \dots, m i1,2,…,m。标签 y i y_i yi 取值于 k k k 个整数 { 1 , 2 , … , k } \{1, 2, \dots, k\} {1,2,…,k}，从而构…...
【汇正自控阀门集团】签约智橙PLM，智橙助泵阀“以国代进”
签约智橙，汇正阀门的“以国代进”举措 随着阀门市场竞争日益激烈、市场需求日益多样化，无论是出口海外、以国代进，还是进军新能源、造船、油气等投资景气的下游市场，阀门企业能否在快速迭代产品、保持技术领先的同时，…...
【macOS】iTerm2介绍
iTerm2 和 iTerm 是 macOS 上两个不同的终端模拟器，虽然名字相似，但它们是两个独立的项目，且 iTerm2 是 iTerm 的现代化继承者。以下是它们的核心区别和演进关系： 1. 历史背景 项目诞生时间状态开发者iTerm2002 年已停止维护Greg…...
2025年五一假期旅游市场新趋势：理性消费、多元场景与科技赋能
2025年五一假期，国内旅游市场再次迎来爆发式增长，官方数据显示，假期期间国内出游人次达3.14亿，游客总消费1802.69亿元。尽管数据规模亮眼，但深入分析可发现，旅游市场正经历结构性变革——消费行为趋于理性、…...
第3章 模拟法
3.1 模拟法概述 模拟法设计思想 模拟法通过将现实问题抽象成计算机可识别的符号与操作，按逻辑顺序“模拟”其过程，从而得到结果；它不依赖复杂公式或高深技巧，只需理清问题背景与实现步骤即可。 示例：鸡兔同笼问题 题…...
16.状态模式：思考与解读
原文地址:状态模式：思考与解读 更多内容请关注：深入思考与解读设计模式 引言 在开发软件系统时，特别是当对象的行为会随着状态的变化而变化时，系统往往会变得复杂。你是否遇到过这样的情况：一个对象的行为在不同的状…...
ActiveMQ 源码剖析：消息存储与通信协议实现（二）
四、KahaDB 消息存储实现细节 （一）存储原理分析 KahaDB 作为 ActiveMQ 从 5.4 版本开始的默认消息存储引擎，其基于日志文件的存储原理具有独特的设计和优势 。在 KahaDB 的存储目录（如${activemq.data}/kahadb）下&am…...
明远智睿SD2351核心板：工业AIoT时代的创新引擎
在当今工业互联网飞速发展的浪潮中，人工智能（AI）与物联网（IoT）的深度融合正以前所未有的态势重塑着传统制造业的格局。从自动化生产线的精准控制到智能仓储的高效管理，从设备运行的实时监测到产品质量的严格…...
iPhone 和 Android 在日期格式方面的区别
整篇文章由iPhone 和 Android 在日期格式方面有所不同引起，大致介绍了，两种时间标准，以及在 JavaScript 下的格式转换方法。 Unix 时间戳是从1970年1月1日(UTC/GMT的午夜)开始所经过的秒数,不考虑闰秒。 iPhone 和 Android 在日期格式方面有所不同。其中，iPhone（iOS）使…...
使用VSCode在Windows 11上编译运行项目
使用VSCode在Windows 11上编译运行项目 VSCode是一个功能强大的跨平台代码编辑器，可以很好地支持C/C项目开发。以下是使用VSCode在Windows 11上编译运行此项目的详细步骤。 1. 安装VSCode 访问VSCode官网下载并安装VSCode安装完成后，启动VSCode 2. 安…...
边缘计算，运维架构从传统的集中式向分布式转变
在当今数字化时代，边缘计算的崛起正在改变着运维的格局。随着物联网、5G 等技术的快速发展，越来越多的数据和应用正在向边缘设备迁移，这给运维团队带来了新的挑战和机遇。 一、边缘计算崛起带来的运维挑战 边缘计算将计算和数据存储靠近数据…...
【基础篇】prometheus热更新解读
文章目录 本篇内容讲解热更新参数源码解读本篇总结本篇内容讲解 prometheus热更新源码解读 热更新参数 –web.enable-lifecycle ： 代表开启热更新配置 修改配置文件发http请求# curl -X POST -vvv localhost:9090/-/reload * About to connect() to localhost port 9090 (…...
为了结合后端而学习前端的学习日志（1）——纯CSS静态卡片案例
前端设计专栏 使用纯CSS创建简洁名片卡片的学习实践 在这篇技术博客中，我将分享我的前端学习过程，如何使用纯HTML和CSS创建一个简洁美观的名片式卡片，就像我博客首页展示的那样。这种卡片设计非常适合作为个人简介、产品展示或团队成员介绍…...
汽车服务小程序功能点开发
汽车养护服务功能 智能保养预约：根据车辆品牌、型号及行驶里程，自动推荐保养项目，支持线上预约 4S 店或合作维修厂，选择服务时间与地点。故障诊断与维修：车主上传车辆故障现象，系统智能初步诊断࿰…...
SENSE2020BSI sCMOS科学级相机主要参数及应用场景
SENSE2020BSI sCMOS科学级相机是一款面向宽光谱成像需求的高性能科学成像设备，结合了背照式（Back-Side Illuminated, BSI）CMOS技术与先进信号处理算法，适用于天文观测、生物医学成像、工业检测等领域。以下是其核心特点及技术细节…...
《汽车噪声控制》复习重点
题型 选择 填空 分析 计算 第一章 噪声定义 不需要的声音，妨碍正常工作、学习、生活，危害身体健康的声音，统称为噪声 噪声污染 与大气污染、水污染并称现代社会三大公害 声波基本概念 定义 媒质质点的机械振动由近及远传播&am…...
物流无人机结构与载货设计分析！
一、物流无人机的结构与载货设计模块运行方式 1.结构设计特点 垂直起降与固定翼结合：针对复杂地形（如山区、城市）需求，采用垂直起降（VTOL）与固定翼结合的复合布局，例如“天马”H型无人机&am…...
docker创建一个centOS容器安装软件（以宝塔为例）的详细步骤
备忘：后续偶尔忘记了docker虚拟机与宿主机的端口映射关系，来这里查看即可： docker run -d \ --name baota \ --privilegedtrue \ -p 8888:8888 \ -p 8880:80 \ -p 8443:443 \ -p 8820:20 \ -p 8821:21 \ -v /home/www:/www/wwwroot \ centos…...
D盘出现不知名文件
各位大佬，电脑D盘去年还干干净净的，后来突然就出现了所圈部分的几个不知名文件，请问这是什么东西？是否可以删除？...
Rust 中 Arc 的深度分析：从原理到性能优化实践
在 Rust 的并发编程中，Arc（Atomic Reference Counted） 是一个非常关键的智能指针类型，用于在多个线程之间共享数据的所有权。它通过原子操作维护引用计数，确保在多线程环境下安全地管理堆内存资源。然而，很…...
qsort函数
在本篇中，将深入了解qsort函数的用法。 1.qsort函数的基础知识 该函数是用来排序的，这是一个可以直接用来排序数据的库函数（#include<stdlib.h>），底层使用的是快速排序的方式。 常见的排序方式有： …...
01 一文了解大数据存储框架：数据库、数据仓库、数据集市、数据网格、数据湖、数据湖仓
1. 大数据存储框架 1.1 定义 数据库（Database）：数据库是按照数据结构来组织、存储和管理数据的仓库，是一个长期存储在计算机内的、有组织的、可共享的、统一管理的大量数据的集合。数据仓库（Data Warehouseÿ…...
QT —— QWidget（2）
QT —— QWidget（2） windowTitlewindowIconQt 资源系统 (qrc 机制) 详解基本概念使用方法1. 创建 .qrc 文件 设置背景windowOpacity 我们今天继续来学习QWidget，如果大家上一次的博客还没有看过，可以点击这里： https:/…...