当前位置：首页 > news >正文

第 4 篇：Motion 拖拽与手势动画（交互篇）—— 打造直觉化交互体验

news 来源：原创 2025/8/26 0:14:25

Framer Motion 的拖拽与手势系统让实现复杂交互变得异常简单。本文将深入解析核心 API，并通过实战案例演示如何创造自然流畅的交互体验。
在这里插入图片描述

🧲 拖拽动画基础

1. 启用拖拽

使用 drag 属性即可开启拖拽能力。支持的值有：true（全方向拖拽）、"x"（仅允许横向拖动）、"y"（仅允许纵向拖动）。

import { motion } from 'motion/react';<motion.div drag style={{ width: 100, height: 100, background: '#09f', borderRadius: 8 }}>拖我一下
</motion.div>

2. 限制拖拽范围

通过 dragConstraints 限制组件拖拽的边界。它接受一个对象或一个 DOM 元素的 ref。

// 使用对象定义边界：左 0，右 100，上 0，下 50
<motion.div drag dragConstraints={{ left: 0, right: 100, top: 0, bottom: 50 }} />// 使用容器 DOM 作为边界
const constraintsRef = useRef(null);<div ref={constraintsRef} style={{ width: 300, height: 200, border: '1px solid #ccc' }}><motion.div drag dragConstraints={constraintsRef} />
</div>

3. 拖拽弹性

dragElastic 控制拖拽超出边界后的回弹力度，值越大表示越“有弹性”。

<motion.div drag dragConstraints={{ left: 0, right: 100 }} dragElastic={0.8} />

4. 拖拽释放动量与过渡

dragTransition 用于定制拖拽释放后的过渡动画。它支持以下参数：

bounceStiffness: 弹性刚度，值越大弹跳速度越快。
bounceDamping: 弹性阻尼，值越大表示越“稳重”、回弹越慢。
power: 控制释放时速度对最终距离的影响。
timeConstant: 控制速度衰减（当 power 不设时有效）。
modifyTarget: 自定义拖动释放的目标值。

<motion.divdragdragConstraints={{ left: 0, right: 300 }}dragTransition={{ bounceStiffness: 300, bounceDamping: 20 }}style={{ width: 100, height: 100, background: '#f09', borderRadius: 16 }}
/>

合理配置 dragTransition 能够创造更自然的拖拽释放体验，特别适合弹性卡片、吸附动画等场景。

🖱️ 用户交互动画

1. `whileHover` 与 `whileTap`

通过 whileHover 与 whileTap 可以快速定义悬停和点击动画，常用于按钮、卡片等组件交互反馈。

  <motion.button whileHover={{ scale: 1.1, rotate: -2 }} whileTap={{ scale: 0.95, rotate: 0 }} className=" rounded-4xl bg-amber-400 w-[200px] h-[60px] text-amber-100 font-bold">点我</motion.button>

2. 组合手势动画 + 回调事件

你也可以组合 variants、whileHover 和 whileTap 实现更细腻的交互体验，并结合 onTap, onHoverStart, onHoverEnd 处理业务逻辑。

<motion.divvariants={cardVariants}whileHover="hover"whileTap="tap"onTap={() => alert("点击事件触发")}onHoverStart={() => console.log("悬停开始")}onHoverEnd={() => console.log("悬停结束")}className="bg-blue-500 px-4 py-2 rounded-2xl text-white font-bold">交互卡片</motion.div>

📦 实战示例

示例一：拖拽式卡片组件

通过简单配置实现卡片的拖拽、悬停、点击缩放等交互。

const Card = () => (<motion.divdragdragElastic={0.6}whileHover={{ scale: 1.05, boxShadow: '0px 4px 10px rgba(0,0,0,0.15)' }}whileTap={{ scale: 0.95 }}style={{width: 150,height: 100,background: '#ccc',borderRadius: 12,display: 'flex',alignItems: 'center',justifyContent: 'center',}}>拖我！</motion.div>
);

示例二：交互式卡片反馈系统

const InteractiveCard = () => {const [isDragging, setIsDragging] = useState(false);return (<motion.divdragonDragStart={() => setIsDragging(true)}onDragEnd={() => setIsDragging(false)}whileHover={{ scale: 1.05, zIndex: 1 }}whileTap={{ scale: 0.95 }}animate={{scale: isDragging ? 1.1 : 1,boxShadow: isDragging? '0px 20px 40px rgba(0,0,0,0.3)': '0px 5px 15px rgba(0,0,0,0.1)'}}transition={{ type: 'spring', stiffness: 400 }}style={{ width: 160, height: 120, background: '#fff', borderRadius: 12 }}/>);
};

示例三：卡片缩放与排序反馈（预告）

通过 drag + layout + motionValue 实现卡片重新排序，将在后续《布局动画》一节详细讲解。

<motion.div layout drag dragConstraints={{ left: 0, right: 0 }} />

🚀 性能与调试建议

为什么要这样做？

拖拽动画通常会频繁触发 DOM 更新，如果不加以优化，可能会出现掉帧、延迟等现象。以下方式可以帮助你保持动画流畅：

拖拽性能优化技巧

<motion.divdragdragMomentum={false}     // 禁用动量滚动，避免多余动画计算dragElastic={0}          // 禁用弹性回弹，提高拖拽响应速度style={{willChange: 'transform', // 提前通知浏览器该元素将变形，触发硬件加速touchAction: 'none'      // 避免移动端默认滚动行为}}
/>

拖拽事件监控

使用 onDragStart、onDrag、onDragEnd 可精确捕捉用户交互过程，便于调试或联动状态管理：

<motion.divdragonDragStart={() => console.log('拖拽开始')}onDrag={(e, info) => console.log('当前坐标:', info.point)}onDragEnd={() => console.log('拖拽结束')}
/>

可视化调试边界

使用边框辅助线或背景色可快速确认组件拖拽区域是否设置正确：

<motion.divdragdragConstraints={{ left: -100, right: 100 }}style={{border: '2px dashed #e74c3c',position: 'relative'}}
/>

✅ 最佳实践小结

拖拽元素建议提升 z-index，避免被遮挡
layout 属性可自动处理拖拽后的回弹与布局更新
悬停动效建议在 200-300ms，点击反馈不超过 100ms
注意跨平台适配（桌面与移动）
注意无障碍支持（如添加 aria-label）

<motion.buttondragwhileTap={{ scale: 0.95 }}aria-label="可拖拽按钮"
/>

掌握这些技巧后，Framer Motion 的拖拽与交互系统将不再神秘，你可以为产品带来更自然、更细腻的动态体验。在下一篇《📘 第 5 篇：布局动画与卡片排序》中，我们将探索 layout 布局动画与动态排序逻辑，敬请期待。

第 4 篇：Motion 拖拽与手势动画（交互篇）—— 打造直觉化交互体验

Framer Motion 的拖拽与手势系统让实现复杂交互变得异常简单。本文将深入解析核心 API，并通过实战案例演示如何创造自然流畅的交互体验。 🧲 拖拽动画基础 1. 启用拖拽使用 drag 属性即可开启拖拽能力。支持的值有：true（全方向…...

编程日记 2025/8/26 0:14:25

TDengine 语言连接器（R语言）

简介 R 语言是一种用于统计分析、绘图和数据挖掘的编程语言和软件环境。 TDengine 支持 R 语言访问 TDengine 数据库，通过 R 语言中的 RJDBC 库可以使 R 语言程序支持访问 TDengine 数据。以下是安装过程、配置过程以及 R 语言示例代码。安装过程在开始之前&…...

编程日记 2025/8/26 5:18:39

Vue Router（3）- 历史记录模式、路由元信息

历史记录模式 Vue Router 支持多种历史管理模式，主要区别在于 URL 的表现形式和页面刷新/直接访问时的处理方式。如果需要最好的兼容性或没有服务器配置权限，使用 Hash 模式如果需要干净的 URL 并能配置服务器，使用 History 模式&#xff…...

编程日记 2025/8/20 16:25:52

android studio 运行java main报错

运行某个带main函数的java文件报错 Could not create task :app:Test.main(). > SourceSet with name main not found. 解决办法：在工程的.idea/gradle.xml 文件下添加： <option name"delegatedBuild" value"false" /&g…...

编程日记 2025/8/25 20:16:13

TDengine 3.3.6.3 虚拟表简单验证

涛思新出的版本提供虚拟表功能，完美解决了多值窄表查询时需要写程序把窄表变成宽表的处理过程，更加优雅。超级表定义如下： CREATE STABLE st01 (ts TIMESTAMP,v0 INT,v1 BIGINT,v2 FLOAT,v3 BOOL) TAGS (device VARCHAR(32),vtype VARCHAR(…...

编程日记 2025/8/23 0:52:03

什么是进程？

目录冯诺依曼体系操作系统(OperatorSystem) 设计OS的目的进程 task_struct 操作 /proc文件夹父子进程创建子进程了解进程之前，我们先说说冯诺依曼体系结构，这是计算机硬件方面的知识。冯诺依曼体系我们常见的计算机，如笔记…...

编程日记 2025/8/23 12:28:34

mysql备份存储过程、函数和事件

背景今天还原mysql数据库备份发现，数据库中没有存储过程和函数，虽然不推荐研发使用数据库的函数、存储过程，但还是免不了有人偶尔使用，所以整理备份和还原策略。数据库备份 mysqldump -u user -p --routines --triggers --ev…...

编程日记 2025/8/20 14:53:42

【正点原子STM32MP257连载】第五章 ATK-DLMP257B文件系统简介 #文件系统 #SSH

1）实验平台：正点原子ATK-DLMP257B开发板 2）浏览产品：https://www.alientek.com/Product_Details/135.html 3）全套实验源码手册视频下载：正点原子资料下载中心文章目录第五章 ATK-DLMP257B文件系统简介5.1…...

编程日记 2025/8/24 10:11:04

实战5：Python使用循环神经网络生成诗歌

实战5：Python使用循环神经网络生成诗歌使用依赖加载数据词典构建和文本预处理总代码在我们学习了课程8后，我们在实战练习一个例子。你的主要任务：学习如何使用简单的循环神经网络（Vanilla RNN）生成诗歌。亚历山大谢…...

编程日记 2025/8/20 12:20:09

【网络安全】谁入侵了我的调制解调器？（二）

文章目录针对 TR-069 协议 REST API 的攻击思路攻击百万台调制解调器意外发现 Cox 后端 API 的授权绕过漏洞确认我们能够进入任何人的设备访问和更新任何Cox商业客户账户通过泄露的加密密钥覆盖任何人的设备设置执行对任何调制解调器的命令影响最后想说阅读本文前，请先行浏览…...

编程日记 2025/8/26 0:22:00

当纺织车间遇上“数字魔法”--天拓四方飞鸟物联平台+边缘计算采集网关的智造革命

在传统印象里，纺织车间总是机器轰鸣、纱线纷飞，工人穿梭其间手动调整参数，次品率全凭经验“拿捏”。但如今，某纺织龙头企业的智能工厂里，一台台纺织机像被施了“聪明咒”，自己会“说话”、会“思考”&#…...

编程日记 2025/8/20 13:13:10

基于PLC的停车场车位控制系统的设计

2.1 设计目标本课题为基于PLC的停车场车位控制系统来设计，在此将功能确定如下： 针对8个车位的停车场进行设计将停车场分为入口处，车位处、以及出口处三个部分；每个车位都有指示灯指示当前位置是否空闲，方便司机查找空…...

编程日记 2025/8/23 7:55:21

1.可接入的广告，点击右下角查看接入文档 https://www.csjplatform.com/union/media/union/download/groMore 2.进入接入文档，选择最新版本进行接入 pod Ads-CN-Beta,6.8.0.2pod GMGdtAdapter-Beta, 4.15.22.0pod GDTMobSDK,4.15.30pod KSAdSDK,3.3.74.0p…...

编程日记 2025/8/24 22:49:04

【iOS】OC高级编程 iOS多线程与内存管理阅读笔记——自动引用计数（二）

自动引用计数前言ARC规则所有权修饰符**__strong修饰符**__weak修饰符__unsafe_unretained修饰符__autoreleasing修饰符规则属性数组前言上一篇我们主要学习了一些引用计数方法的内部实现，现在我们学习ARC规则。 ARC规则所有权修饰符 OC中，为了处…...

编程日记 2025/8/21 3:55:08

智能语音识别+1.2用SAPI实现文本转语音(100%教会)

欢迎来到智能语音识别系列的第二篇文章. 上一篇文章的地址在这:智能语音处理1.1下载需要的库(100%实现)-CSDN博客想必上一篇的操作(文本转语音)已经成功实现了接下来,我们要学习用SAPI技术去实现文本转语音一.简单介绍SAPI技术 SAPI是架构在COM基础上的，微软…...

编程日记 2025/8/24 15:15:13

Unity导出微信小游戏后无法调起移动端输入框

参考官方demo 参考demo https://gitee.com/wechat-minigame/minigame-unity-webgl-transform/tree/main/Demo/API_V2 里面有对输入文本框适配的处理方法，还有一些其他功能展示 1 使用Unity打开/Demo/API目录，API示例开发版本为Unity 2022.3.14f1。 2 若…...

编程日记 2025/8/25 16:40:00

16.使用豆包将docker-compose的yaml转为k8s的yaml，安装各种无状态服务

文章目录 docker方式httpbinit-toolslinux-commandmyipreference docker-compose安装k8s方式 docker方式 httpbin A simple HTTP Request & Response Service https://httpbin.org/ https://github.com/postmanlabs/httpbin https://github.com/mccutchen/go-httpbin do…...

编程日记 2025/8/19 19:24:27

每日OJ_牛客_kotori和抽卡（二）_数学_C++_Java

目录牛客_孩子们的游戏_约瑟夫环题目解析 C代码 Java代码牛客_孩子们的游戏_约瑟夫环孩子们的游戏(圆圈中最后剩下的数)_牛客题霸_牛客网描述： 每年六一儿童节，牛客都会准备一些小礼物和小游戏去看望孤儿院的孩子们。其中，有个游戏…...

编程日记 2025/8/23 18:49:12

整活 kotlin + springboot3 + sqlite 配置一个 SQLiteCache

要实现一个 SQLiteCache 也是很简单的只需要创建一个 cacheManager Bean 即可 // 如果配置文件中 spring.cache.sqlite.enable false 则不启用 Bean("cacheManager") ConditionalOnProperty(name ["spring.cache.sqlite.enable"], havingValue "t…...

编程日记 2025/8/25 14:47:27

JVM：运行时数据区和线程

一、运行时数据区概述 （1）整体架构 JVM 启动时，操作系统会为它分配相应的内存空间，接着 JVM 会对分配到的空间进行划分。当 JVM 退出，这些空间会被回收。JVM 将分配到的内存空间主要分成五部分：程序计数器…...

编程日记 2025/8/24 0:28:47

Lucene.NET + Jieba分词：核心词典与停用词配置详解

文章目录前言一、dict.txt：核心分词词典1. 文件作用2. 文件格式3. 配置方法二、cn_synonym.txt：同义词扩展库1. 文件作用2. 文件格式3. 在 Lucene 中使用三、stopwords.txt：停用词表1. 文件作用2. 文件格式3. 配置方法四、实战&#xff1…...

编程日记 2025/8/24 9:23:12

软件测试之测试数据生成（Excel版）

这是Excel生成测试数据的函数使用 1.时间 1.1.时间例生成2022-05-01之前一年内任意时间点： =TEXT("2022-05-01"-RAND()-RANDBETWEEN(1,365),"yyyy-mm-dd hh:mm:ss")1.2.年月日 yyyy-mm-dd 以当前时间生成10年的日期 =TEXT(NOW()-RAND()-RANDBETWE…...

编程日记 2025/8/26 5:07:02

局域网内Docker镜像共享方法

在局域网内将Docker镜像构建并传输到另一台电脑，可以通过以下几种方法实现。以下是具体步骤及注意事项，结合不同场景的适用方案： 方法一：使用 docker save 和 docker load 传输镜像文件步骤说明在构建机上保存镜像通过 docker…...

编程日记 2025/8/24 7:25:45

解决WinEdt编辑器出现文字不会适应软件宽度的问题

解决WinEdt编辑器出现文字不会适应软件宽度的问题问题描述解决问题描述在使用WinEdt编辑Latex文本时，发现突然动了下键盘，或者突然就在编辑文本时不能自动换行，而是超出了软件屏幕的宽度。解决按住ctrl w ，直到界面变成下…...

编程日记 2025/8/26 3:25:09

跨境电商管理转型：日事清通过目标管理、流程自动化助力智优美科技项目管理升级与目标落地复盘

1.客户背景介绍深圳市智优美科技有限公司是一家专业从事外贸B2C的电子商务公司，公司总部位于深圳市宝安区，旗下拥有三家子公司。目前销售的品类有：家居用品、电子产品、电子配件产品等，在深圳外贸电商行业销售额稳居行业前10名。…...

编程日记 2025/8/25 0:47:40

高防CDN、高防IP vs 高防服务器：核心优势与选型指南

一、高防服务器的核心局限高防服务器是指通过机房部署硬件防火墙（如集群防火墙、流量清洗设备）来防御DDoS攻击的物理或虚拟服务器。其核心问题在于： 单点防御风险：依赖单一服务器硬扛攻击，若攻击流量超过防御阈值&am…...

编程日记 2025/8/25 15:55:09

入门-C编程基础部分：5、变量

飞书文档https://x509p6c8to.feishu.cn/wiki/PVnawQn5DiVhHhkMApqcDyDvnWg 变量的作用？ 存储程序运行时，需要存储一些可能会变化的数据。 C 中每个变量都有特定的类型，类型决定了变量存储的大小和布局。变量的名称可以由字母、数字和下划…...

编程日记 2025/8/23 7:28:07

Kafka深度解析与实战应用

Kafka深度解析与实战应用作者：LedgerX技术团队发布日期：2025年4月16日引言在当今数字时代，数据已成为企业的核心资产，而高效处理大规模数据流的能力则成为现代后端系统的关键挑战之一。Apache Kafka作为一个分布式流处理平台…...

编程日记 2025/8/23 23:48:39

数学教学通讯杂志数学教学通讯杂志社数学教学通讯编辑部2025年第6期目录

课程教材教法 “课程思政”视域下的高中数学教学探索与实践——以“函数概念的发展历程”为例赵文博; 3-617 PBL教学模式下高中统计教学的探索与实践——以“随机抽样（第一课时）”为例陈沛余; 7-10 “三新”背景下的高中数学教学困境与应对…...

编程日记 2025/8/25 8:30:48

【JavaEE初阶】多线程重点知识以及常考的面试题－多线程进阶（二）

本篇博客给大家带来的是多线程中synchronize的实现原理和JUC(java.util.concurrent) 常见类的相关知识点. 🐎文章专栏: JavaEE初阶 🚀若有问题评论区见 ❤ 欢迎大家点赞评论收藏分享如果你不知道分享给谁,那就分享给薯条. 你们的支持是我不断创作的…...

编程日记 2025/8/24 9:27:14

Flutter PIP 插件 ---- iOS Video Call 自定义PIP WINDOW渲染内容

以下是一篇关于在 iOS 中实现画中画(PiP)功能的技术博客: iOS 画中画(PiP)功能实现指南效果简介画中画(Picture in Picture, PiP)是一项允许用户在使用其他应用时继续观看视频内容的功能。本文将详细介绍如何在 iOS 应用中实现 PiP 功能，包括自定义内容渲染和…...

编程日记 2025/8/25 15:47:24

【正点原子STM32MP257连载】第四章 ATK-DLMP257B功能测试——4G模块ME3630测试

1）实验平台：正点原子ATK-DLMP257B开发板 2）浏览产品：https://www.alientek.com/Product_Details/135.html 3）全套实验源码手册视频下载：正点原子资料下载中心文章目录第四章 ATK-DLMP257B功能测试——4G模…...

编程日记 2025/8/22 15:24:25

高并发内存池（四）：内存释放原理与实现

前言：经过前3期的攻坚，我们已完整实现了内存动态申请的核心模块。接下来将进入关键阶段——内存释放机制的理解与实现，这是构建完整高并发内存池的最后一块技术拼图。该模块完成后，项目主体架构将基本成型（达90%&…...

编程日记 2025/8/25 3:44:17

【正点原子STM32MP257连载】第四章 ATK-DLMP257B功能测试——EEPROM、SPI FLASH测试 #AT24C64 #W25Q128

1）实验平台：正点原子ATK-DLMP257B开发板 2）浏览产品：https://www.alientek.com/Product_Details/135.html 3）全套实验源码手册视频下载：正点原子资料下载中心文章目录第四章 ATK-DLMP257B功能测试——EEP…...

编程日记 2025/8/24 22:39:23

《突破控件限制：用Qt绘图API解锁高级界面定制能力》

一、基本概念虽然 Qt 已经内置了很多的控件，但是不能保证现有控件就可以应对所有场景。很多时候我们需要更强的 “自定制” 能力。 Qt 提供了画图相关的 API，允许我们在窗口上绘制任意的图形形状来完成更复杂的界面设计所谓的 “控件” 本质上也是通…...

编程日记 2025/8/25 17:29:11

MyBatis-Plus 中BaseMapper接口是如何加速微服务内部开发的？

假设我们有一个简单的微服务项目，需要对 User 实体进行基本的数据库操作。场景一：使用原生 MyBatis 的开发流程 (作为对比) 定义实体类 (Entity): // package com.yourcompany.usermicroservice.entity; public class User {private Long id;private S…...

编程日记 2025/8/24 16:05:26

AIGC-十款数据分析类智能体完整指令直接用(DeepSeek，豆包，千问，Kimi，GPT)

Unity3D特效百例案例项目实战源码Android-Unity实战问题汇总游戏脚本-辅助自动化Android控件全解手册再战Android系列Scratch编程案例软考全系列Unity3D学习专栏蓝桥系列AIGC(GPT、DeepSeek、豆包、千问、Kimi)👉关于作者专注于Android/Unity和各种游戏开发技巧，以及各种资…...

编程日记 2025/8/22 18:07:31

鸿蒙应用（医院陪诊系统）开发篇1·主页面的tabs布局

引言： 首先可在鸿蒙开发者官网找到DevEco Studio的安装教程。安装好了之后，我们开始开发。知识点： tabs布局，鸿蒙官方文档地址：https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-contai…...

编程日记 2025/8/25 10:46:59

【大模型】DeepSeek + Coze 打造个人专属AI智能体使用详解

目录一、前言二、AI智能体介绍 2.1 什么是AI智能体 2.2 AI智能体核心能力 2.3 AI智能应用场景三、coze 介绍 3.1 coze是什么 3.1.1 平台概述 3.1.2 平台适用人群 3.2 平台核心功能 3.3 coze可以做什么 3.4 为什么选择coze 四、coze 搭建AI智能体操作实践 4.1 搭…...

编程日记 2025/8/25 15:02:41

7.（vue3.x+vite）弹性布局（flex布局）

1：效果截图 2：代码实现 <template><span style="font-size: 20px">右边固定，左边自适应</span><div class=<...

编程日记 2025/8/17 21:17:55

Python基础总结(五)之字典

文章目录一、字典的格式二、字典的操作2.1 增加项2.1.1 直接增加项2.1.1 formkeys方法 2.2 删除项2.2.1 clear()方法2.2.2 pop()方法 2.3 修改项2.3.1 直接修改2.3.2 update()方法 2.4 查找项2.4.1 get()方法2.4.2 直接查询2.4.3 items()方法2.4.4 keys()方法2.4.5 values()方…...

编程日记 2025/8/25 18:01:04

MCP简介：重构人机交互底层逻辑

在人工智能技术飞速发展的今天，大语言模型（LLM）的应用场景正不断拓展，但模型与外部系统之间的连接方式却成为制约其潜力发挥的关键瓶颈。为了解决这一难题，由AI领域顶尖公司Anthropic（Claude模型背后的开发…...

编程日记 2025/8/25 20:55:24

LangChain缓存嵌入技术完全指南：CacheBackedEmbedding原理与实践（附代码示例）

一、嵌入缓存技术背景与应用场景 1.1 为什么需要嵌入缓存？ 算力消耗问题：现代嵌入模型（如text-embedding-3-small）单次推理需要约0.5-1秒/文本资源浪费现状：实际业务中约30%-60%的文本存在重复计算成本压力&#…...

编程日记 2025/8/24 4:11:06

国产DPU芯片+防火墙，能否引领网络安全新跨越？

近日，国内首款搭载国产DPU芯片的800Gbps下一代防火墙——中科网威NSFW - 12000正式发布，引发行业广泛关注。国产DPU芯片与防火墙的结合，正在推动网络安全领域实现技术突破与体系升级。以下从技术特性、应用场景和产业价值三个维度分析其引领…...

编程日记 2025/8/21 4:34:39

Spark-SQL与Hive的连接及数据处理全解析

Spark-SQL与Hive的连接及数据处理全解析在大数据处理领域，Spark-SQL和Hive都是重要的工具。今天就来聊聊Spark-SQL如何连接Hive以及相关的数据处理操作。 Spark-SQL连接Hive有多种方式。内嵌Hive虽然使用简单，直接就能用，但在实际生产中…...

编程日记 2025/8/25 16:19:06

ArcGIS Desktop使用入门（四）——9版本与10版本区别

系列文章目录 ArcGIS Desktop使用入门（一）软件初认识 ArcGIS Desktop使用入门（二）常用工具条——标准工具 ArcGIS Desktop使用入门（二）常用工具条——编辑器 ArcGIS Desktop使用入门（二&#x…...

编程日记 2025/8/26 1:03:29

使用 chromedriver 实现网络爬虫【手抄】

1、引用 selenium 包 <dependency><groupId>org.seleniumhq.selenium</groupId><artifactId>selenium-java</artifactId><version>4.29.0</version> </dependency> <dependency><groupId>org.seleniumhq.seleniu…...

编程日记 2025/8/24 4:22:27

ERROR: Unknown host CPU architecture: arm64

1、先检查NDK版本是否支持arm64，NDK版本21.3以上 2、检查gradle中，有关NDK版本是否设置arm64-v8a 例如： ndkVersion "21.4.7075529"ndk {abiFilters "armeabi-v7a","arm64-v8a"} local.properties中&#x…...

编程日记 2025/8/24 15:15:18

从 SQL2API 到 Text2API：开启数据应用开发的新征程

在技术革新浪潮的席卷下，数据应用开发领域正经历着深刻变革。曾经，构建数据 API 需要开发者具备扎实的数据库知识和编程技能，手动编写复杂的 SQL 查询与 API 代码，这一过程不仅耗时费力，还将众多非技术人员阻挡在数据应…...

编程日记 2025/8/20 17:36:22

OpenCv高阶（四）——角点检测

一、角点检测在计算机视觉中，角点检测是识别图像中局部区域（角点）的关键技术，这些区域通常是两条或多条边缘的交点，具有丰富的结构信息，常用于图像匹配、跟踪、三维重建等任务。 Harris角点检测算法是一…...

编程日记 2025/8/22 15:27:28