我需要一个对 Angular 多边形颜色填充,根据屏幕宽度/高度调整大小。此处绿色背景填充:http://rhiwifi.co/bus是一个使用旋转 DIV 的原型(prototype)。该 DIV 占屏幕的 200%,因此它超出了移动界面的边界,并且无法正确填充屏幕底部。
如何绘制一个可调整大小的多边形,其顶部为对 Angular 线,底部为矩形?或者有更简单的方法吗?
最佳答案
我只是将坐标存储为比例值,而不是绝对像素。
也就是说,我会使用 [0..1] 范围内的数字来定义一个点。然后,您只需将其乘以 Canvas 尺寸即可获得像素尺寸。
例如,您想绘制一个占据 Canvas 左上角 1/4 的矩形,如下定义: “0,0,0.5,0.5” - 然后您可以根据逗号分割成一个数组。然后,您可以将数组中的每个元素乘以 Canvas 大小以获得最终坐标。
例如,2d OpenGL 视口(viewport)使用标准化坐标,其中 0,0 是屏幕中心,-1,-1 是左上角,1,1 是右下角。这样,openGL 只需乘以窗口大小即可获得像素值。
关于javascript - HTML5 Canvas 可调整大小的多边形,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12677361/