Show HN: 用于标记点和多边形区域的免费工具

Hacker News Top 工具

摘要

Tack 是一款免费的基于浏览器的工具,允许用户标记点、绘制多边形,并将坐标数据导出为 JSON 或 YAML 格式,而无需将图片上传至服务器。

在我正在开发的一款游戏中,我需要一种简便的方式来在图片上创建热点区域。于是,我匆忙拼凑了一个小工具来实现这个功能,不知不觉间,我已经开发出了一个完整的应用程序 :-)<p>它允许你将标记在图片上的坐标生成 JSON 或 YAML 格式的数据。Tack 完全在浏览器中运行,没有任何服务器端组件,因此在隐私方面表现良好。<p>希望这对你有帮助。
查看原文
查看缓存全文

缓存时间: 2026/05/09 15:36

# tack. — 在图像上标记坐标 来源:https://tack.pics/ 标记 · 追踪 · 导出 ## 牢牢固定\. 一款用于在图像上标记点和多边形区域的精确工具。免费,完全在浏览器中运行——您的图像永远不会离开您的设备。 JSON / YAML 导出贝塞尔曲线多边形自定义原点 / 单位离线工作 \(PWA\) 关于 tack\. ## 将坐标固定在任意图像上——放入图像,点击输出,复制数据。 tack\. 专为游戏开发者、关卡设计师、UI 工程师、ML 数据标注人员以及任何需要将图片转换为结构化坐标集的人而设计。放入图像,点击放置点,拖拽绘制贝塞尔曲线,并导出干净的 JSON 或 YAML,可直接粘贴到您的代码中。 选择原点位置——左上角适用于屏幕空间,左下角适用于数学空间,或居中适用于对称布局。如果您使用数学坐标系,可以翻转 Y 轴。如果需要分辨率无关的数据,可以切换到 0–1 归一化输出。 特性 ## 专为精确工作打造。 ### 点与多边形 放置单个点,绘制开放的多段线,或将形状闭合为多边形。可以在同一图像上混合使用这三种方式。 ### 贝塞尔曲线 点击并拖拽以添加带有手柄的光滑锚点。使用 Alt 打破对称;使用 Shift 重新同步。 ### 多个原点 左上、右上、左下、右下、居中,或您点击的任意自定义点。 ### 像素或归一化 通过一个开关在绝对像素和 0-1 归一化坐标之间切换。 ### Y 轴翻转 无需手动重新映射,即可匹配屏幕空间 \(Y 向下\) 或数学空间 \(Y 向上\)。 ### 往返 JSON 将现有 JSON 加载回工具中进行编辑。无需从头重新追踪。 ### 撤销 / 重做 100 步历史记录。Cmd+Z 和 Cmd+Shift+Z,正如您预期的那样。 ### 键盘微调 方向键可将选定的锚点微调 1 像素。按住 Shift 可实现 10 像素的跳跃。 ### 离线工作 作为 PWA 安装。访问一次后,应用可在无网络连接的情况下运行。 用例 ## 人们使用 Tack 的场景。 - 2D 游戏碰撞边界 - 点击/触摸目标的命中区域 - AI 路径寻路点 - 生成点和触发器 - 交互式地图的热区 - ML 数据集的注释区域 - 基于图像的 UI 布局坐标 - 精灵锚点 - 感兴趣区域提取 - 平面图/蓝图标记 隐私 ## 您的图像永远不会离开您的设备。 Tack 完全在浏览器中运行。您加载的图像、绘制的点、导出的 JSON——没有任何数据上传到任何地方。没有服务器端处理,没有账户,没有登录。我们仅收集匿名、无 cookie 的页面浏览分析数据,以便了解网站是否触达用户。阅读隐私声明 (https://tack.pics/privacy/)和服务条款 (https://tack.pics/terms/)。

相似文章

Show HN:一个ASCII 3D渲染引擎

Hacker News Top

GlyphCSS是一个JavaScript库,它使用ASCII字符在DOM中渲染带纹理的3D网格,支持多种3D格式,并与原生JS、React和Vue集成。