求实现鼠标越靠近中心返回值越大的函数（现有代码效果不佳）

我明白你的问题了——你想要实现一个随鼠标靠近屏幕中心而递增的数值，但当前的实现因为用了X/Y方向到边缘距离的线性相加，导致空间上的变化不够均匀（比如对角线和轴线上“感觉”离中心距离差不多的位置，数值却一样），咱们来优化一下：

先分析现有代码的问题 #

你当前的代码逻辑是计算鼠标到最近屏幕边缘的距离之和，再映射到目标数值。这会出现不符合直觉的情况：

• 比如鼠标在屏幕边缘的中点（(0, height/2)），和在距离中心1/4宽高的位置（(width/4, height/4)），两者的posX+posY都是1，速度相同，但实际上后者离中心更近，应该有更大的速度才对。

正确的实现方案 #

核心思路是基于鼠标到屏幕中心的直线距离来计算，这样能保证空间上的变化均匀自然，同时可以轻松调整变化曲线。

基础线性版本（适配p5.js环境） #

// 计算屏幕中心坐标
const centerX = width / 2;
const centerY = height / 2;

// 计算鼠标到中心的直线距离
const distanceToCenter = dist(mouseX, mouseY, centerX, centerY);

// 计算屏幕的最大可能距离（中心到角落的距离）
const maxDistance = dist(0, 0, centerX, centerY);

// 映射距离到速度：距离越近（值越小），速度越大
const speed = map(distanceToCenter, 0, maxDistance, 30, 0);

非线性版本（可选，调整变化曲线） #

如果想要靠近中心时数值增长更快，或者远离时衰减更平缓，可以用平方/平方根来调整映射关系：

// 先把距离归一化到 0-1 范围
const normalizedDistance = distanceToCenter / maxDistance;

// 平方放大：靠近中心时增长更迅猛
const speed = map(normalizedDistance ** 2, 0, 1, 30, 0);

// 平方根平缓：整体变化更柔和
// const speed = map(Math.sqrt(normalizedDistance), 0, 1, 30, 0);

为什么这个方案更好 #

• 基于直线距离的计算，保证了所有到中心距离相同的点，返回的数值完全一致，空间变化更符合直觉；
• 可以通过调整映射的范围（比如把30换成你需要的最大值），或者加入非线性运算，轻松适配不同的交互需求。

内容的提问来源于stack exchange，提问作者matthieu994