javascript - 确定中心

标签 javascript html css

我正在开发一个圆形图表,其中有围绕它移动的线条(像时钟,但不一定那么规则)。这些线实际上将代表矢量,因此它们将具有 Angular 和大小。我正在对图像执行此操作(除非有人有更好的主意)并且我正在更改图像的大小以表示幅度,并且我正在使用 CSS 转换来更改 Angular 。我的问题是,我似乎从来不知道如何定位图像,使它看起来像是从圆心发出的线。现在我正在使用 CSS top 和 left 属性来定位图像。有没有人有任何想法来开发一种算法来保持图像“居中”或者有更好的方法来做到这一点?我会使用 HTML 和 canvas 标签,但我必须支持 IE8。

最佳答案

Does anybody have any ideas for developing an algorithm to keep the image "centered" or have an idea for a better way to do this? I would use HTML and the canvas tag, but I have to support IE8.

你应该使用拉斐尔:

http://raphaeljs.com/

Raphaël currently supports Firefox 3.0+, Safari 3.0+, Chrome 5.0+, Opera 9.5+ and Internet Explorer 6.0+.

有圆圈的随机演示:http://raphaeljs.com/polar-clock.html

拉斐尔获得选票的类似问题“如何制作图表”:What method would be best to build this complex graph


回答你问题的另一部分:

I am using CSS transformations to change the angle. Right now I am using CSS top and left properties to position the image.

你看过transform-origin了吗? ?

关于javascript - 确定中心,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6265365/

相关文章:

javascript - Marionette Controller 最佳实践

jquery - 为什么这个 jQuery 对象未定义?

javascript - JS 创建的 html 链接不会在 chrome 中打开?

像 Border Radius 这样的 CSS 设计

javascript - 当我将 JavaScript 元素添加到我的 SVG 文件时,它消失了

javascript - 在哪里捕获运行语句中的 $location.search() 变量?为了重建国家

javascript - 在 Chrome 71+ 上激活触摸事件

javascript - 无法在 Vue js 的 v-for 循环中动态地将 Prop 传递给组件

javascript - CSS - 谁能帮我弄清楚我的下拉菜单导航哪里出了问题?

javascript - RegEx 用于检测 JavaScript 中的操作系统版本