前端求助:如何优雅的让 canvas 的原点 (0, 0) 从左下角开始?

查看 75|回复 3
作者:Cat   
众所周知,在网页中 0,0 一般是在页面左上角,向右向下延申(此处暂不考虑 RTL 情况)
现在要绘制一些图形,甲方给的数据中 0,0 是在左下角,也就是说 Y 轴的起点是在底部
目前的做法是把所有的 Y 坐标反正为负数,视觉上就反过来了,但后续的许多处理都特别麻烦
突然想到那些图表组件,例如散点图折线图,它们的 Y 轴起点一般也在底部
想请教各位大佬,这部分有什么比较优雅的处理方式吗
感谢!

延申, 图折线, 起点, rtl

cheese   
没啥好办法,要么你就劫持原生方法,直接输入甲方的坐标,然后计算成左上角为原点的,再输入 canvas 绘图
KouShuiYu   
试试 css
transform: rotateX(180deg);
Mutoo   
用 webgl 绘制,它的坐标系统就是 y 向上的。或者在你的 canvas 2d 绘制系统抽象一个摄像机空间,然后所有的绘制操作都通过这个相机做一个坐标系变换。
您需要登录后才可以回帖 登录 | 立即注册

返回顶部