我正在嘗試找出一種將 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)
這是我對上面代碼的理解,它是相對的,所以我將從 -74,585 開始,然后移動 -1,0,然后開始一個弧線,該弧線在 -735.2,736.2 的起點處遠離弧線的起點。弧中心將基于 I 和 J 資訊。由于這是相對的,I 和 J 是否相對于弧的起點?
對于弧的中心,這將如何轉化為 svg 弧?我是否認為對于 SVG 貝塞爾曲線 (Q),控制點位于曲線的“外部”,而對于 g 代碼,中心位于內部?
I can parse the data that I have and generate the following 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>
I've not added the script I'm using to generate this (written in PHP) as it's verbose and pulls data from a database so wouldn't really help. The orientation is wrong, but I can fix that up with a transform on the overall SVG. The lines responsible for the arc have the Q in them and it's the control point value that I can't for the life of me mathematically work out based on the I J values for the point in the g-code. Any help or advice would be greatly appreciated.
uj5u.com熱心網友回復:
You cannot convert a circular arc, as described by a G02 or G03 command, into a faithfull quadratic bezier curve, as described by a Q command - it would at best be an approximation. In addition there really is no need. SVG path commands include the A command, which describes elliptical arcs. Its syntax is:
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)
This is a lot more complex than you need, because in can describe elliptical arcs that are rotated as well. In your case, the first two parameters, describing the elipses radii, are identical, and the third one is 0, because a rotated circle does not change.
What you need to do first is to determine the radius of the circle from the distance between the starting point and the center of the rotation. The center coordinate is relative to that starting point, so you can simply write
$r = hypot($I, $J)
The large arc flag and the sweep flag are needed to discern between the four possible solutions to draw an arc with a certain radius. The large arc flag describes wether the arc covers more than 180 degrees. If I understand the restrictions of CNC machinery right, this is not possible. Therefor the value should probably be 0 (false) - correct me if I am wrong. The sweep flag describes whether the arc goes clockwise or counterclockwise. So its value is 1 (true) for a G02 command, and 0 (false) for a G03 command.
If you use the relative a command, the final x and y coordinates are simply the same as the X and Y values.
Together, the G-code command
G02X-735.2Y736.2I0.4J735.6
can be written as the path command d attribute
d="M-75,585 a 735.6001 735.6001 0 0 1 -735.2,736.2"
As a final note, you can also write straight lines with relative coordinates if you use the l command. G01X-1.0Y0.0 can be written both as
d="M-74,585 -75,585"
and
d="M-74,585 l -1,0"
Depending on your requirements, you can even combine multiple lines in one <path> element, like this:
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 ..."
with m 0,0 saying that the new line should start where the previous ended. Or you can also draw one, continuous line with multiple segments:
d="M-74,585 l -1,0 a 735.6001 735.6001 0 0 1 -735.2,736.2 l 10,0 ..."
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/436612.html
上一篇:c#將斜杠附加到路徑引數
下一篇:2的陣列長度為2?
