使用坐标以编程方式旋转形状

2023-12-10

如果我有一些使用坐标数组定义的形状,例如

[[-30, -30], [-30, 30], [30, 30], [30, -30]]

和边缘定义使用:

[[0,1],[0,3],[1,2],[2,3]]

做一个正方形。

如何以编程方式告诉形状在 JavaScript 中以 0->359 的角度在中心旋转 *?

*或者更好的是,是否有一个功能可以让我选择旋转中心?

** 目前,我已经成功使用以下方法获得了围绕画布的形状:

var x_rotate = Math.sin(angle * Math.PI /180);
var y_rotate = Math.cos(angle * Math.PI /180);

// for each coordinate
//add x_rotate and y_rotate if coordinate > 0 or subtract if coordinate < 0 

在这里,旋转点x, y周围点centerx, centery by degrees度。返回浮点值,如果需要则进行舍入。

要旋转形状,请旋转所有点。如果需要的话计算中心,这不行。

Desmos 链接x as a, y as b, centerx as p, centery as q, and degrees as s

function rotatePoint(x, y, centerx, centery, degrees) {
    var newx = (x - centerx) * Math.cos(degrees * Math.PI / 180) - (y - centery) * Math.sin(degrees * math.PI / 180) + centerx;
    var newy = (x - centerx) * Math.sin(degrees * Math.PI / 180) + (y - centery) * Math.cos(degrees * math.PI / 180) + centery;
    return [newx, newy];
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用坐标以编程方式旋转形状 的相关文章

  • 使用 获取用于 javascript 的 RSA 密钥?

    我的 Web 项目需要一个 RSA 密钥对 虽然有一些库 但我认为依靠浏览器 为了安全性和速度 为我生成密钥是个好主意 是否可以使用注册机或其他浏览器 API 来执行此操作 我不知道如何从注册机获取密钥 它们似乎是在提交时生成的 但我不想将
  • JavaScript 中的“new”关键字是什么?

    The newJavaScript 中的关键字第一次遇到时可能会很混乱 因为人们倾向于认为 JavaScript 不是面向对象的编程语言 它是什么 它解决什么问题 什么时候合适 什么时候不合适 它做了 5 件事 它创建一个新对象 这个对象的
  • 为什么“事件”在 Chrome 中全局可用,而在 Firefox 中则不然?

    在回答另一个问题时 出现了一个与event对象在匿名函数中可用 无需传入 在 Chrome 中 下面的代码工作正常 但 Firefox 会抛出错误 document ready function uspsSideboxTrackingClo
  • 如果浏览器在 asp .net 中关闭,请从浏览器中注销?

    我的要求有点复杂 用户正在使用 Web 浏览器访问数据库 而在访问数据库时 如果用户关闭活动页面而不是注销会话 该会话需要自动注销 有人可以指导我如何做这个吗 我在母版页中使用了jquery onbeforeunload 我收到消息离开页面
  • 有没有办法监控页面上运行的 JavaScript 函数?

    有没有办法查看页面上正在执行哪些功能 如果我在页面上加载外部脚本 是否可以动态更改函数的功能或阻止其运行 HTML5 http www w3 org TR html5 scripting 1 html establish script bl
  • Google Charts(AreaChart)如何检测缩放变化

    我正在画一个面积图 在覆盖层上有一些标记 我正在使用explorer选项 仅限水平 以便用户放大和缩小 问题是我找不到一种方法来通知缩放更改 以便有机会更新制造商位置 有一个图表范围变化事件 但它不是由 AreaChart 触发的 我尝试检
  • ngx-DataTable 对列进行排序无法正常工作 Angular 4

    虽然我对角度非常陌生 但我在使用 ngx DataTable 时遇到了一些困难 我使用简单的 ngx DataTable 进行简单的操作 问题出在列上 尽管我已将 attr 声明为 sortable true 但排序不起作用 这是代码 表定
  • React/Redux bundle.js 太大

    我有一个小型的 React 项目 Webpack生成的bundle js大小为6 3Mb 如何将大小减小到 github webpack config js module exports devtool inline source map
  • 如何在提交表单之前删除自动数字格式?

    我正在使用 jQuery 插件自动数字 http www decorplanit com plugin 但是当我提交表单时 我无法删除之前字段上的格式POST 我尝试使用 input autonumeric destroy 和其他方法 但它
  • Nodemailer:从未收到问候语

    当尝试使用 Nodemailer 在 Node 内发送电子邮件时 https github com nodemailer nodemailer https github com nodemailer nodemailer 调用sendMai
  • 在 IE10 中禁用捏合放大

    在 IE10 触摸模式下 我希望仅使页面的特定部分可缩放 其余的不应该 我找到了这个 http msdn microsoft com en US library ie hh772044 aspx http msdn microsoft co
  • 单击输入字段会触发窗口调整大小

    我有一个带有徽标 菜单和搜索的标题 当我在桌面上时 我会按该顺序显示所有元素 但如果我的窗口宽度小于 980 像素 菜单会隐藏 有一个切换按钮 并且徽标会与nav并附在徽标之后 如果宽度更大 则徽标将再次分离并附加到 DOM 中的旧位置 w
  • canvas.getContext('2D') 返回空值

    我创建了一个画布并将其命名为getContext 方法 但它返回null为上下文 这是我使用的代码 我在控制台中得到了这个
  • EJS在JS onload函数中访问express变量

    我知道你可以像这样获取 ejs 文件中变量的值 h1 h1 如果我要在同一个 ejs 页面的 onload javascript 函数中使用相同的标题变量 我将如何使用它 例如 这个函数产生一个控制台错误说 未捕获的语法错误 意外的标识符
  • 获得一次性绑定以适用于 ng-if

    这个问题已经被之前问过 https stackoverflow com questions 23969926 angular lazy one time binding for expressions 但我无法让该解决方案发挥作用 所以我想
  • 带时间戳的 Firestore 查询

    如果它是文本字段 我可以使用 where 条件获取数据 但是当我尝试对时间戳字段和日期执行相同操作时 事情不起作用 这是我的代码 home ts firebase firestore collection cities where time
  • 由于固定导航,增加了 FancyBox v2 的顶部和底部边距

    我目前正在开发一个网站 该网站将来将具有响应能力 该网站主要由图像组成 单击这些图像会加载到 FancyBox 中 FancyBox v2 现在具有响应能力 因此可以在屏幕尺寸发生变化时重新调整图像等的大小 作为我设计的一部分 我有两个固定
  • JavaScript 访问密码字段值是否被视为存在安全风险?

    如果安全 正确地存储密码是良好的风格和安全性 那么对于要求用户输入密码的网页来说不应该也是如此吗 考虑这个例子
  • ReferenceError 和全局对象

    在浏览器中的 JavaScript 中window是全局对象 这意味着在全局范围内定义的每个变量都是window 那么为什么我会得到这个结果 console log window foo No error logs undefined co
  • 如何从配置加载套接字 io 事件监听器? [复制]

    这个问题在这里已经有答案了 我有使用套接字io 的nodejs 应用程序 我将存储在 config routes js 中的所有事件侦听器 module exports routes auth login controller auth a

随机推荐