用圆形夹住小地图的箭头

如何解决用圆形夹住小地图的箭头

我目前正在为一款游戏制作迷你地图，在其中跟踪屏幕内外的不同重要项目。当我第一次通过渲染到纹理上并以微型显示器显示在屏幕上的辅助相机创建迷你地图时，它是矩形形状。我能够确保当重要的项目离开地图视图时，指向目标的箭头会出现并保持在地图的边缘。它基本上是将箭头的 x 和 y 位置夹紧到相机视图宽度和长度的一半（有一些合适的边距空间）。

无论如何。现在我正在尝试使迷你地图圆形，虽然我有适当的渲染蒙版来保证迷你地图的形状，但我很难将箭头固定到新迷你地图的形状上。在矩形小地图中，箭头在夹住时停留在角落，但显然，圆圈没有角落。

我想夹紧箭头的 x 和 y 位置与圆的半径（屏幕/小地图高度的一半）有关，但是因为我在数学方面有点弱，所以我很友善请求一些帮助。我如何将箭头夹在新圆形的边缘？

我现在的代码如下：

let {width: canvasWidth,height: canvasHeight} = cc.Canvas.instance.node,// 960,640
targetScreenPoint = cc.Camera.main.getWorldToScreenPoint(this.targetNode.position)

// other code for rotation of arrow,etc...

// FIXME: clamp the the edge of the minimap mask which is circular
// This is the old clamping code for a rectangle shape.

let arrowPoint = targetScreenPoint;
arrowPoint.x = utils.clamp(arrowPoint.x,(-canvasWidth / 2) + this.arrowMargin,(canvasWidth / 2) - this.arrowMargin);
arrowPoint.y = utils.clamp(arrowPoint.y,(-canvasHeight / 2) + this.arrowMargin,(canvasHeight /2) - this.arrowMargin);
            
this.node.position = cc.v2(arrowPoint.x,arrowPoint.y);

我可能还应该注意到，技术上所有小地图符号和箭头都在屏幕上，但仅通过剔除蒙版显示在辅助摄像头上......你知道，以防万一。

解决方法

对于其他想要做同样事情的人，我基本上将箭头指向的目标节点的方向标准化，并将其乘以图像蒙版的半径（具有适当的边距空间）。

由于播放器节点和蒙版中心在原点，我只是从播放器中获得了差异。 (640/2) 是直径，当然，它不应该被硬编码，但暂时不应该。感谢那些评论并让我朝着正确方向思考的人。

let direction = this.targetNode.position.sub(this.playerNode.position).normalize();
let arrowPos = direction.mul((640/2) - this.arrowMargin);
this.node.position = arrowPos;