laya2d 与 cad 之间的坐标转换 - 张居斜

时间:2024-02-20 22:03:01

laya2d 与 cad 之间的坐标转换

坐标系基本概念

直角坐标系可分为左手坐标系与右手坐标系,cad 中用到的是右手坐标系, Laya2D 中用到的是左手坐标系, Laya3D 中使用右手坐标系。
那么如何判断二维直角坐标系是左手还是右手呢?

以原点 O 为支点, 将 x 轴逆时针旋转 90° 后, 若其与 y 轴同向则为右手坐标系,若与 y 轴反向,则为左手坐标系。

在 Laya 中显示 cad 坐标对象

基本原则:不改变数据坐标,改变Laya 容器坐标。

  • 保持根容器不变,变换子容器坐标原点位置
  • 缩放子容器坐标比例
// 例如,我们 Laya 容器坐标系位置变换为屏幕左下角开始的右手坐标系
let drawingSp = new Laya.Sprite();
// 原点从左上角,改为左下角
drawingSp.pos(0, Laya.Browser.Height);
// x 轴保持不变, y 轴反向
drawingSp.scale(1, -1);
// 将  drawingSp 加入根容器
Laya.stage.addChild(rootSp);

通过上面的变换处理,将 drawingSp 中的坐标系改为原点为平面左下方的右手坐标系。其中很重要的一点是:

在未对子容器的坐标系进行变化处理时,子容器的坐标系默认与容器重合。容器的缩放以容器的坐标原点为中心完成。 这也是我们多容器操作的基础。

同理,我们也可以通过对容器的坐标平移、缩放等变换处理, 在当前屏幕中,显示传入的全部数据, 代码如下:

let drawingSp = new Laya.sprite();  // 不对 drawing 坐标系处理,对子容器 viewSp 处理
let viewSp = new Laya.sprite();
// sp 坐标移动到左下角,并给一定的偏移
viewSp.pos(xoffset, Laya.Browser.Height - yoffset);
// 将容器整体缩放,以展示全部输入数据
let ratio = screenWidth / inputDataWidth;
viewSp.scale(ratio, ratio); // 等比例缩放,将容器放大或缩小以适应展示数据

通过以上转换,我们就可以将数据在当前屏幕上显示。