我正试图找到一种将g代码插入SVG图像的方法。我可以想象用坐标画直线很容易,但我很难画圆弧。我不知道如何将IJ系统解释为SVG中的弧形。
(ORIGIN=BOTTOM LEFT)
(METRIC)
G71
(RELATIVE)
G91
M16
(PART 1)
G00X-74.7Y585.5
M15
G01X-1.0Y0.0
G02X-735.2Y736.2I0.4J735.6
G01X10.0Y0.0
G01X0.0Y75.0
G01X501.2Y0.0
G01X0.0Y-75.0
G01X10.0Y0.0
G03X215.0Y-215.0I214.4J-0.6
G01X0.0Y-10.0
G01X75.0Y0.0
G01X0.0Y-501.2
G01X-75.0Y0.0
G01X0.0Y-10.0
M16
(PARK)
这是我对上面代码的理解,它是相对的,所以我会从-74585开始,然后移动-1,0,然后开始一个弧,在距离弧起点735.2736.2的地方结束。弧中心将基于I和J信息。因为这是相对的,I和J是相对于弧的起点的吗?
对于弧的中心,这将如何转化为svg弧?我认为SVG贝塞尔曲线(Q(的控制点在曲线的"外侧",而g代码的中心在内侧,这是对的吗?
我可以解析我所拥有的数据并生成以下SVG:
<svg viewBox="-820 -35 4283 1441">
<path class="path" d="M-74,585 -75,585" style="stroke:black;stroke-width:5"></path>
<path class="path" d="M-75,585 Q -810 1321 -810 1321" style="fill:none;stroke:black;stroke-width:5"></path>
<path class="path" d="M-810 1321 -800,1321" style="stroke:black;stroke-width:5"></path>
<path class="path" d="M-800,1321 -800,1396" style="stroke:black;stroke-width:5"></path>
<path class="path" d="M-800,1396 -299,1396" style="stroke:black;stroke-width:5"></path>
<path class="path" d="M-299,1396 -299,1321" style="stroke:black;stroke-width:5"></path>
<path class="path" d="M-299,1321 -289,1321" style="stroke:black;stroke-width:5"></path>
<path class="path" d="M-289,1321 Q -74 1106 -74 1106 " style="fill:none;stroke:black;stroke-width:5"></path>
<path class="path" d="M-74 1106 -74,1096" style="stroke:black;stroke-width:5"></path>
<path class="path" d="M-74,1096 1,1096" style="stroke:black;stroke-width:5"></path>
<path class="path" d="M1,1096 1,595" style="stroke:black;stroke-width:5"></path>
<path class="path" d="M1,595 -74,595" style="stroke:black;stroke-width:5"></path>
<path class="path" d="M-74,595 -74,585" style="stroke:black;stroke-width:5"></path>
<path class="path" d="M-74,585 -74,585" style="stroke:red;stroke-width:10"></path>
</svg>
我还没有添加我用来生成它的脚本(用PHP编写(,因为它很冗长,而且从数据库中提取数据,所以没有真正的帮助。方向是错误的,但我可以通过对整个SVG进行转换来解决这个问题。负责弧的线中有Q,这是我一生都无法根据g代码中点的IJ值进行数学计算的控制点值。如有任何帮助或建议,我们将不胜感激。
您无法将G02
或G03
命令所描述的圆弧转换为Q
命令所述的忠实二次贝塞尔曲线-这充其量只是一个近似值。此外,确实没有必要。SVG路径命令包括描述椭圆弧的A
命令。其语法为:
A rx ry x-axis-rotation large-arc-flag sweep-flag x y (absolute notation)
a rx ry x-axis-rotation large-arc-flag sweep-flag x y (relative notation)
这比你需要的要复杂得多,因为中可以描述旋转的椭圆弧。在您的情况下,描述消隐半径的前两个参数是相同的,第三个参数是0,因为旋转的圆不会改变。
首先需要做的是根据起点和旋转中心之间的距离来确定圆的半径。中心坐标是相对于起点的,所以你可以简单地写
$r = hypot($I, $J)
需要大弧标志和扫频标志来区分四种可能的解决方案,以绘制具有特定半径的弧。大弧线标志描述弧线是否覆盖180度以上。如果我理解数控机械的限制权利,这是不可能的。因此,该值可能应该是0
(false(-如果我错了,请纠正我。扫掠标志描述圆弧是顺时针还是逆时针。因此,对于G02
命令,其值为1
(true(,而对于G03
命令,其数值为0
(false(。
如果使用相对a
命令,则最终的x和y坐标与X
和Y
值完全相同。
G代码指令
G02X-735.2Y736.2I0.4J735.6
可以写成路径命令d
属性
d="M-75,585 a 735.6001 735.6001 0 0 1 -735.2,736.2"
最后要注意的是,如果使用l
命令,也可以编写具有相对坐标的直线。G01X-1.0Y0.0
可以同时写为
d="M-74,585 -75,585"
和
d="M-74,585 l -1,0"
根据您的需求,您甚至可以在一个<path>
元素中组合多行,如下所示:
d="M-74,585 l -1,0 m 0,0 a 735.6001 735.6001 0 0 1 -735.2,736.2 m 0,0 l 10,0 ..."
其中CCD_ 17表示新行应该从上一行结束的地方开始。或者你也可以画一条带有多个线段的连续线:
d="M-74,585 l -1,0 a 735.6001 735.6001 0 0 1 -735.2,736.2 l 10,0 ..."