@graphty/graph-io 0.3.47 → 0.3.49

package/dist/src/formats/gml/styles.js

@@ -13,22 +13,26 @@
  * bends and other keys stay. The `graphty.styles` block and the per-element values its rules read are keys too,
  * named by the GML writer's rule for names that are not GML keys (`graphty_styles`, `graphty_style_node_<key>`).
  */
-import { bendsToPoints, canonBends } from "../../styles/canon/bends.js";
+import { bendsToPoints, canonBends, canonNodeOffsets, nodeOffsetsToPoints, } from "../../styles/canon/bends.js";
 import { canonColor, colorOpacity } from "../../styles/canon/color.js";
 import { canonEnum } from "../../styles/canon/enums.js";
-import { canonNumber } from "../../styles/canon/number.js";
+import { canonNumber, canonSigned, num6 } from "../../styles/canon/number.js";
 import { MAX_STYLE_VALUE_LENGTH, noteAt, scalarText } from "../../styles/canon/site.js";
 import { canonText } from "../../styles/canon/text.js";
 import { STYLE_ISSUE } from "../../styles/codes.js";
-import { CYTOSCAPE_LEXICON } from "../../styles/cytoscape/lexicon.js";
+import { CYTOSCAPE_LEXICON, javaFamily } from "../../styles/cytoscape/lexicon.js";
 import { StyleApproximations } from "../../styles/io/approximations.js";
-import { blockStyles, parseStyleBlock, STYLE_BLOCK_NAME, styleBlockLosses, styleTag, writeStyleBlock, } from "../../styles/io/block.js";
+import { parseStyleBlock, STYLE_BLOCK_NAME, styleBlockLosses, styleTag, writeStyleBlock, } from "../../styles/io/block.js";
+import { elementValues, takeFromBlock } from "../../styles/io/round-trip.js";
 import { dataRead } from "../../styles/io/writer.js";
 import { StyleNotes } from "../../styles/notes.js";
 import { styleFingerprint } from "../../styles/plan/features.js";
-import { plainCell, resolveStyles } from "../../styles/plan/resolve.js";
+import { plainCell } from "../../styles/plan/resolve.js";
+import { GRAPHVIZ_GLYPH_SHAPES } from "../dot/drawing.js";
+import { graphvizArrowValue, graphvizHasNoOutline, graphvizOutline, graphvizRouteBends, PERIPHERY_GAP, putGlyph, SHAPE_PERIPHERIES, } from "../dot/styles.js";
 import { gephiRules } from "../gexf/styles.js";
-import { flowchartShape, FONT_STYLES, valueColumns, YED_ARROWS, YED_LINES, YED_SHAPES, yedColor, yedSpelled, yedValue, } from "../graphml/styles-yed.js";
+import { configurationOutline, FONT_STYLES, valueColumns, YED_ARROWS, YED_LINES, YED_SHAPES, yedColor, yedFontName, yedSpelled, yedValue, } from "../graphml/styles-yed.js";
+import { writtenByGv2gml } from "./positions.js";
 import { KEY_MANGLED_CODE, mangleGmlKey } from "./syntax.js";
 /** The writers recognized by their `Creator` text, first match wins. */
 const WRITERS = [
@@ -55,7 +59,8 @@ const WRITERS = [
             vocabulary: "graphlet",
             spelling: "css",
             units: "relative",
-            labelKey: false,
+            // Gephi's preview draws node labels as the GEXF reader reads them (formats/gexf/styles.ts)
+            labelKey: true,
         },
     ],
     [
@@ -77,6 +82,18 @@ const UNKNOWN_WRITER = {
     units: "px",
     labelKey: true,
 };
+/**
+ * Graphviz's gv2gml (no `Creator`; `version 2` inside the graph): Graphviz's attribute values (shape names, colors,
+ * arrow names, sizes in points, y up) under GML keys, with Graphviz's defaults beneath.
+ */
+const GV2GML_WRITER = {
+    dialect: "graphviz",
+    tool: "graphviz",
+    vocabulary: "graphviz",
+    spelling: "graphviz",
+    units: "px",
+    labelKey: true,
+};
 /** A file graphty wrote: yEd keys, and the `graphty.styles` block gives the rules. */
 const GRAPHTY_WRITER = { ...WRITERS[0][1], tool: null };
 /**
@@ -113,8 +130,27 @@ function graphText(snapshot, name) {
     return typeof v === "number" ? String(v) : null;
 }
 /**
- * Who wrote a GML file: the `Creator` line (top level, or a key of the graph block as Gephi writes it), or graphty when
- * the file holds a `graphty.styles` block.
+ * A node label's `anchor` as a label position: yEd's `n`, `s`, `e`, `w` and the corners `nw`, `ne`, `sw`, `se` place it
+ * outside the node; `c` and the inside places `t`, `b`, `l`, `r`, `tl`, `tr`, `bl`, `br` keep it inside, which graphty
+ * draws centered.
+ */
+const GML_ANCHORS = new Map([
+    ...["c", "t", "b", "l", "r", "tl", "tr", "bl", "br"].map((a) => [a, "center"]),
+    ["n", "top"],
+    ["s", "bottom"],
+    ["e", "right"],
+    ["w", "left"],
+    ["nw", "top-left"],
+    ["ne", "top-right"],
+    ["sw", "bottom-left"],
+    ["se", "bottom-right"],
+]);
+/** Node keys only yEd writes: its group hierarchy. */
+const YED_NODE_KEYS = ["isGroup", "gid"];
+/**
+ * Who wrote a GML file: the `Creator` line (top level, or a key of the graph block as Gephi writes it), graphty when
+ * the file holds a `graphty.styles` block, or yEd when a file with no `Creator` holds keys only yEd writes (`isGroup`,
+ * `gid`, the graph's `hierarchic`).
  * @param snapshot - the graph
  * @returns the writer
  */
@@ -128,7 +164,12 @@ function writerOf(snapshot) {
             return writer;
         }
     }
-    return UNKNOWN_WRITER;
+    // keys only yEd writes name it even without a Creator line (BioNetGen writes yEd GML with none)
+    if (creator.trim() === "" &&
+        (YED_NODE_KEYS.some((k) => snapshot.nodes.has(k)) || snapshot.graph.has("hierarchic"))) {
+        return WRITERS[0][1];
+    }
+    return creator.trim() === "" && writtenByGv2gml(snapshot) ? GV2GML_WRITER : UNKNOWN_WRITER;
 }
 /** The edge's `arrow` key of the GML draft: which ends have an arrow. */
 const ARROW_ENDS = new Map([
@@ -137,17 +178,63 @@ const ARROW_ENDS = new Map([
     ["first", ["triangle", "none"]],
     ["both", ["triangle", "triangle"]],
 ]);
-/** OGDF's stroke types (`stipple`), by number. */
+/**
+ * The node shape names Cytoscape's GML reader knows (NodeShapeVisualProperty, any case, with Cytoscape 2.x's `rect`
+ * and `round_rect`); any other name it ignores, so its default style's shape is drawn.
+ */
+const CYTOSCAPE_GML_SHAPES = new Map([
+    ["ellipse", "ellipse"],
+    ["round_rectangle", "round-rectangle"],
+    ["round_rect", "round-rectangle"],
+    ["rectangle", "rectangle"],
+    ["rect", "rectangle"],
+    ["hexagon", "hexagon"],
+    ["octagon", "octagon"],
+    ["parallelogram", "parallelogram"],
+    ["triangle", "triangle"],
+    ["vee", "vee"],
+    ["diamond", "diamond"],
+]);
+/** OGDF's stroke types (`stipple`): by number as older OGDF writes them, or by name as GraphIO::writeGML does. */
 const OGDF_STROKES = ["none", "solid", "dashed", "dotted", "dash-dot", "dash-dot"];
-/** OGDF's shape names the common table does not know. */
+const OGDF_STROKE_NAMES = new Map([
+    ["none", "none"],
+    ["solid", "solid"],
+    ["dash", "dashed"],
+    ["dot", "dotted"],
+    ["dashdot", "dash-dot"],
+    ["dashdotdot", "dash-dot"],
+]);
+/** OGDF's shape names the common table does not know (an Image node without its image draws as its box). */
 const OGDF_SHAPES = new Map([
     ["rect", "rectangle"],
+    ["roundedrect", "round-rectangle"],
     ["rhomb", "diamond"],
-    ["trapeze", "trapezoid"],
-    ["invtrapeze", "trapezoid"],
-    ["invtriangle", "triangle"],
-    ["invparallelogram", "parallelogram"],
+    ["image", "rectangle"],
+]);
+/**
+ * OGDF's shapes that GraphIO::drawSVG draws as polygons no named shape matches, with their corners as `shapePoints`
+ * (fractions of the half width and height, y up), measured in its drawing of
+ * graph-io/test/fidelity/specimens/gml/specimen-node-shapes-p5.gml: the triangles, the pentagon, the hexagon and the
+ * octagon are regular, their corners on the ellipse of the node's box (so they are drawn where the points say, not
+ * stretched to the box: `OGDF_REGULAR`); the trapezes and parallelograms fill the box, their short side half its width.
+ */
+const OGDF_POLYGONS = new Map([
+    ["triangle", "0,1 0.866,-0.5 -0.866,-0.5"],
+    ["invtriangle", "0,-1 0.866,0.5 -0.866,0.5"],
+    ["pentagon", "0,1 0.951,0.309 0.588,-0.809 -0.588,-0.809 -0.951,0.309"],
+    ["hexagon", "1,0 0.5,0.866 -0.5,0.866 -1,0 -0.5,-0.866 0.5,-0.866"],
+    [
+        "octagon",
+        "0.924,0.383 0.383,0.924 -0.383,0.924 -0.924,0.383 -0.924,-0.383 -0.383,-0.924 0.383,-0.924 0.924,-0.383",
+    ],
+    ["trapeze", "-1,-1 1,-1 0.5,1 -0.5,1"],
+    ["invtrapeze", "-1,1 1,1 0.5,-1 -0.5,-1"],
+    ["parallelogram", "-1,-1 0.5,-1 1,1 -0.5,1"],
+    ["invparallelogram", "-1,1 0.5,1 1,-1 -0.5,-1"],
 ]);
+/** OGDF's regular polygons, whose corners lie on the ellipse of the node's box rather than reaching its sides. */
+const OGDF_REGULAR = new Set(["triangle", "invtriangle", "pentagon", "hexagon", "octagon"]);
 /** Keys only yEd writes in a label record: its `fill` is the label's background, not the text color. */
 const YED_LABEL_KEYS = [
     "outline",
@@ -228,15 +315,45 @@ function strokeStyle(raw, kind, writer, at) {
         return null;
     }
     if (writer.vocabulary === "ogdf") {
-        const stroke = OGDF_STROKES[Number(raw)];
-        if (stroke === undefined || stroke === "none") {
+        const stroke = ogdfStroke(raw);
+        if (stroke === undefined) {
             noteAt(at, STYLE_ISSUE.UNKNOWN_VALUE, sampleOf(raw));
             return null;
         }
-        return stroke;
+        // stroke "none" draws no line at all: the callers turn the border or the edge off
+        return stroke === "none" ? null : stroke;
     }
     return canonEnum(kind, raw, writer.spelling, at);
 }
+/**
+ * An OGDF `stipple`: a StrokeType by number or by name.
+ * @param raw - the value
+ * @returns the line style, "none", or undefined for a value OGDF does not know
+ */
+function ogdfStroke(raw) {
+    const text = typeof raw === "string" || typeof raw === "number" ? String(raw).trim() : "";
+    return /^\d+$/.test(text) ? OGDF_STROKES[Number(text)] : OGDF_STROKE_NAMES.get(text.toLowerCase());
+}
+/**
+ * Reads an OGDF node `type` (a Shape name): a polygon where OGDF draws one, else the shape it names.
+ * @param raw - the value
+ * @param writer - the writer
+ * @param put - receives the values
+ * @param at - the sites
+ */
+function readOgdfShape(raw, writer, put, at) {
+    const name = raw.trim().toLowerCase();
+    const points = OGDF_POLYGONS.get(name);
+    if (points !== undefined) {
+        put("shape", "polygon");
+        put("shapePoints", points);
+        if (OGDF_REGULAR.has(name)) {
+            put("shapePointsStretch", false);
+        }
+        return;
+    }
+    put("shape", canonEnum("shape", OGDF_SHAPES.get(name) ?? raw, writer.spelling, at("shape")));
+}
 /**
  * Reads one node's `graphics` record.
  * @param g - the record
@@ -246,18 +363,190 @@ function strokeStyle(raw, kind, writer, at) {
  */
 function readNodeGraphics(g, writer, put, at) {
     const v = writer.vocabulary;
+    if (v === "graphviz") {
+        readGv2gmlNode(g, writer, put, at);
+        return;
+    }
     readNodeFill(g, writer, put, at);
     readNodeOutline(g, writer, put, at);
     put("borderStyle", strokeStyle(v === "ogdf" ? g.stipple : g.outlineStyle, "borderStyle", writer, at("borderStyle")));
-    put("width", g.w === undefined ? null : canonNumber(g.w, at("width")));
-    put("height", g.h === undefined ? null : canonNumber(g.h, at("height")));
-    if (g.type !== undefined) {
-        const raw = v === "ogdf" && typeof g.type === "string" ? (OGDF_SHAPES.get(g.type.toLowerCase()) ?? g.type) : g.type;
-        put("shape", canonEnum("shape", raw, writer.spelling, at("shape")));
+    if (v === "ogdf" && g.stipple !== undefined && ogdfStroke(g.stipple) === "none") {
+        put("borderWidth", 0);
+    }
+    readNodeSize(g, writer, put, at);
+    if (v === "ogdf") {
+        readOgdfLabelOffset(g.label, put, at);
+    }
+    readNodeShape(g, writer, put, at);
+}
+/**
+ * Reads a node's size from its `graphics` record.
+ * @param g - the record
+ * @param writer - the writer
+ * @param put - receives the values
+ * @param at - the sites
+ */
+function readNodeSize(g, writer, put, at) {
+    if (writer.tool === "gephi") {
+        // Gephi's w is a node's size, a radius: its disc is twice as wide, and its h is never read
+        const size = g.w === undefined ? null : canonNumber(g.w, at("width"));
+        put("width", size === null ? null : 2 * size);
+        put("height", size === null ? null : 2 * size);
+    }
+    else {
+        put("width", g.w === undefined ? null : canonNumber(g.w, at("width")));
+        put("height", g.h === undefined ? null : canonNumber(g.h, at("height")));
+    }
+}
+/**
+ * Reads a node's shape from its `graphics` record, in the writer's vocabulary.
+ * @param g - the record
+ * @param writer - the writer
+ * @param put - receives the values
+ * @param at - the sites
+ */
+function readNodeShape(g, writer, put, at) {
+    const v = writer.vocabulary;
+    if (v === "ogdf" && typeof g.type === "string") {
+        readOgdfShape(g.type, writer, put, at);
+    }
+    else if (v === "cytoscape" && g.type !== undefined) {
+        const name = scalarText(g.type, at("shape"))?.trim().toLowerCase() ?? "";
+        const shape = CYTOSCAPE_GML_SHAPES.get(name);
+        if (shape === undefined) {
+            noteAt(at("shape"), STYLE_ISSUE.UNKNOWN_VALUE, name.slice(0, MAX_STYLE_VALUE_LENGTH));
+        }
+        put("shape", shape ?? null);
+    }
+    else if (g.type !== undefined) {
+        put("shape", canonEnum("shape", g.type, writer.spelling, at("shape")));
     }
     else if (v === "yed" && typeof g.customconfiguration === "string") {
         // yEd's flowchart palette keeps a node's shape as a configuration, not a `type`.
-        put("shape", flowchartShape(g.customconfiguration));
+        const outline = configurationOutline(g.customconfiguration);
+        put("shape", outline?.shape ?? null);
+        if (outline?.points !== undefined) {
+            put("shapePoints", outline.points);
+        }
+    }
+}
+/**
+ * Reads where OGDF draws a node's label: GraphIO::writeGML writes the label's center as an offset from the node's
+ * center (`graphics [ label [ x y z ] ]`, GraphAttributes::xLabel / yLabel, y down), and GraphIO::drawSVG draws it there.
+ * @param label - the graphics record's `label` value
+ * @param put - receives the values
+ * @param at - the sites
+ */
+function readOgdfLabelOffset(label, put, at) {
+    if (typeof label !== "object" || label === null || Array.isArray(label)) {
+        return;
+    }
+    const { x, y } = label;
+    put("labelOffsetX", x === undefined ? null : canonSigned(x, at("labelOffsetX")));
+    put("labelOffsetY", y === undefined ? null : canonSigned(y, at("labelOffsetY")));
+}
+/**
+ * Reads one node's `graphics` record as Graphviz's gv2gml writes it (cmd/tools/gv2gml.c emitNodeAttrs): `fill` is the
+ * node's `fillcolor` (or its `color`), drawn only where `hasFill 1` says `style=filled`; `outline` its pen color,
+ * `width` its pen width, `w` and `H` its size in points, `type` its Graphviz shape, `visible 0` its `style=invis`.
+ * @param g - the record
+ * @param writer - the writer
+ * @param put - receives the values
+ * @param at - the sites
+ */
+function readGv2gmlNode(g, writer, put, at) {
+    const shape = typeof g.type === "string" ? g.type.trim().toLowerCase() : "";
+    if (Number(g.hasFill) === 1 || shape === "point") {
+        // filled: the opacity is stated even when opaque, over Graphviz's default of no fill
+        const c = canonColor(g.fill ?? "black", writer.spelling, at("fill"), { use: "fill" });
+        put("fill", c?.color ?? null);
+        put("fillOpacity", c?.alpha ?? null);
+    }
+    else if (g.fill !== undefined) {
+        // Graphviz draws an unfilled node's inside see-through (the tool default), whatever its color
+        noteAt(at("fill"), STYLE_ISSUE.UNFILLED, sampleOf(g.fill));
+    }
+    if (graphvizHasNoOutline(shape)) {
+        put("borderWidth", 0);
+    }
+    else {
+        readColor(g.outline, "borderColor", null, writer, put, at);
+        put("borderWidth", g.width === undefined ? null : canonNumber(g.width, at("borderWidth")));
+    }
+    const borderStyle = strokeStyle(g.outlineStyle, "borderStyle", writer, at("borderStyle"));
+    put("borderStyle", borderStyle);
+    readGv2gmlRings(g, shape, borderStyle, writer, put, at);
+    // gv2gml's w and H are the node's outer size: Graphviz draws each further outline PERIPHERY_GAP outside the one
+    // within, so graphty's node (the innermost outline, its ring outside it) is that much smaller
+    const rings = 2 * PERIPHERY_GAP * ((SHAPE_PERIPHERIES.get(shape) ?? 1) - 1);
+    const inner = (raw, property) => {
+        const n = raw === undefined ? null : canonNumber(raw, at(property));
+        return n === null ? null : Math.max(0, n - rings);
+    };
+    put("width", inner(g.w, "width"));
+    // gv2gml writes the height as H (gv2gml.c emitReal("H", ...)); h where a later edit spelled it as GML does
+    put("height", inner(first(g, "H", "h"), "height"));
+    if (Number(g.visible) === 0 && g.visible !== undefined) {
+        put("visible", false);
+    }
+    const outline = graphvizOutline(shape);
+    if (shape === "polygon") {
+        // ponytail: Graphviz's polygon is a box unless its sides, skew or distortion say otherwise; gv2gml copies
+        // those as node keys beside graphics, which this record does not see. Read them when a file has them.
+        put("shape", "rectangle");
+    }
+    else if (outline !== undefined) {
+        put("shape", "polygon");
+        put("shapePoints", outline);
+        // a Graphviz polygon's corners are where Graphviz draws them, as the DOT reader reads them
+        put("shapePointsStretch", false);
+    }
+    else if (GRAPHVIZ_GLYPH_SHAPES.has(shape)) {
+        const size = (raw, property) => raw === undefined ? null : canonNumber(raw, at(property));
+        putGlyph(shape, size(g.w, "width"), size(first(g, "H", "h"), "height"), put, () => {
+            const pen = g.width === undefined ? 1 : Number(g.width);
+            return Number.isFinite(pen) ? Math.max(0, pen) : 1;
+        }, () => canonColor(g.outline ?? "black", writer.spelling, at("outerBorderColor"), { use: "line" })?.color ??
+            null);
+    }
+    else if (g.type !== undefined) {
+        put("shape", canonEnum("shape", g.type, "graphviz", at("shape")));
+    }
+}
+/**
+ * Reads the second outline Graphviz draws round a `doublecircle`, `doubleoctagon` or `tripleoctagon` (shapes.c):
+ * `PERIPHERY_GAP` points outside the first, in its color, width and dashes, as the DOT reader reads it. graphty draws
+ * one outer ring, so a third outline is noted as not carried.
+ * @param g - the record
+ * @param shape - its Graphviz shape, lowercase
+ * @param style - its outline's dashes, as read
+ * @param writer - the writer
+ * @param put - receives the values
+ * @param at - the sites
+ */
+function readGv2gmlRings(g, shape, style, writer, put, at) {
+    // ponytail: gv2gml copies a `peripheries` attribute as a node key beside graphics, which this record does not
+    // see; the shapes' own outlines are read. Read the key when a file sets it.
+    const count = SHAPE_PERIPHERIES.get(shape) ?? 1;
+    if (count < 2) {
+        return;
+    }
+    const c = canonColor(g.outline ?? "black", writer.spelling, at("outerBorderColor"), { use: "line" });
+    if (c !== null && c.alpha === 0) {
+        return;
+    }
+    const parsed = g.width === undefined ? 1 : Number(g.width);
+    const pen = Number.isFinite(parsed) ? Math.max(0, parsed) : 1;
+    put("outerBorderColor", c?.color ?? "#000000");
+    put("outerBorderOpacity", c !== null && c.alpha < 1 ? c.alpha : null);
+    put("outerBorderWidth", pen);
+    // the gap between the outline's outer edge and the ring's inner edge
+    put("outerBorderOffset", Math.max(0, PERIPHERY_GAP - pen));
+    if (style === "dashed" || style === "dotted") {
+        put("outerBorderStyle", style);
+    }
+    if (count > 2) {
+        noteAt(at("outerBorderWidth"), STYLE_ISSUE.NOT_CARRIED, `type ${shape}`);
     }
 }
 /**
@@ -291,7 +580,8 @@ function readNodeOutline(g, writer, put, at) {
         put("borderWidth", 0);
         return;
     }
-    readColor(v === "ogdf" ? g.line : g.outline, "borderColor", null, writer, put, at);
+    // OGDF's GraphIO::writeGML writes the stroke color as `outline`; older OGDF wrote `line`
+    readColor(v === "ogdf" ? first(g, "outline", "line") : g.outline, "borderColor", null, writer, put, at);
     const width = outlineWidthOf(g, v);
     put("borderWidth", width === undefined ? null : canonNumber(width, at("borderWidth")));
 }
@@ -322,10 +612,31 @@ function outlineWidthOf(g, v) {
  */
 function readEdgeGraphics(g, writer, put, at) {
     const v = writer.vocabulary;
+    if (v === "graphviz") {
+        readGv2gmlEdge(g, writer, put, at);
+        return;
+    }
     readColor(g.fill, "color", "opacity", writer, put, at);
     const width = v === "ogdf" ? first(g, "lineWidth", "width") : g.width;
     put("width", width === undefined ? null : canonNumber(width, at("width")));
     put("lineStyle", strokeStyle(v === "ogdf" ? g.stipple : g.style, "lineStyle", writer, at("lineStyle")));
+    if (v === "ogdf" && g.stipple !== undefined && ogdfStroke(g.stipple) === "none") {
+        put("visible", false);
+    }
+    readEdgeArrows(g, writer, put, at);
+    if (v === "yed") {
+        readYedCurve(g, put);
+    }
+}
+/**
+ * Reads an edge's arrows from its `graphics` record: `arrow` names the ends that have one, and `sourceArrow` and
+ * `targetArrow` (or their snake-case spellings) name each end's arrow.
+ * @param g - the record
+ * @param writer - the writer
+ * @param put - receives the values
+ * @param at - the sites
+ */
+function readEdgeArrows(g, writer, put, at) {
     if (typeof g.arrow === "string") {
         const ends = ARROW_ENDS.get(g.arrow.trim().toLowerCase());
         if (ends === undefined) {
@@ -344,13 +655,68 @@ function readEdgeGraphics(g, writer, put, at) {
         if (raw === undefined) {
             continue;
         }
-        put(property, v === "cytoscape" && cytoscapeArrow !== undefined
+        put(property, writer.vocabulary === "cytoscape" && cytoscapeArrow !== undefined
             ? cytoscapeArrow(raw, at(property))
             : canonEnum("arrow", raw, writer.spelling, at(property)));
     }
-    if (v === "yed") {
-        readYedCurve(g, put);
+}
+/** gv2gml's `arrow`, from Graphviz's `dir`: `first` is `dir=forward` (the head's arrow), `last` is `dir=back`. */
+const GV2GML_DIRECTIONS = new Map([
+    ["first", [false, true]],
+    ["last", [true, false]],
+    ["both", [true, true]],
+    ["none", [false, false]],
+]);
+/**
+ * Reads one edge's `graphics` record as Graphviz's gv2gml writes it (gv2gml.c emitEdgeAttrs): `fill` its color,
+ * `width` its pen width (2 for `style=bold`), `style` its dashes, `visible 0` its `style=invis`, `targetArrow` and
+ * `sourceArrow` its `arrowhead` and `arrowtail`, and `arrow` its `dir`. With none of the arrow keys an edge of a
+ * directed graph has Graphviz's default arrowhead, and one of an undirected graph none.
+ * @param g - the record
+ * @param writer - the writer
+ * @param put - receives the values
+ * @param at - the sites
+ */
+function readGv2gmlEdge(g, writer, put, at) {
+    readColor(g.fill, "color", "opacity", writer, put, at);
+    put("width", g.width === undefined ? null : canonNumber(g.width, at("width")));
+    put("lineStyle", strokeStyle(g.style, "lineStyle", writer, at("lineStyle")));
+    if (Number(g.visible) === 0 && g.visible !== undefined) {
+        put("visible", false);
+    }
+    const ends = gv2gmlArrowEnds(g, writer.directed === true);
+    if (ends === null) {
+        return;
+    }
+    for (const [end, raw, on] of [
+        ["target", g.targetArrow, ends[1]],
+        ["source", g.sourceArrow, ends[0]],
+    ]) {
+        const name = typeof raw === "string" ? raw : "normal";
+        const arrow = on ? graphvizArrowValue(name, at(`${end}Arrow`)) : null;
+        put(`${end}Arrow`, arrow === null ? "none" : arrow.value);
+        if (arrow?.side !== null && arrow?.side !== undefined) {
+            put(`${end}ArrowSide`, arrow.side);
+        }
+    }
+}
+/**
+ * Which ends of a gv2gml edge Graphviz draws an arrow at, as its `dir` says (forward in a directed graph when the
+ * record names no arrow), or null for an undirected graph's edge that names none.
+ * @param g - the edge's `graphics` record
+ * @param directed - whether the graph is directed (its `dir` defaults to forward)
+ * @returns [source, target], or null
+ */
+function gv2gmlArrowEnds(g, directed) {
+    if (g.arrow === undefined && g.targetArrow === undefined && g.sourceArrow === undefined) {
+        // Graphviz's dir is forward in a digraph and its arrowhead normal: gv2gml writes neither when unset
+        return directed ? [false, true] : null;
+    }
+    let dir = directed ? "first" : "none";
+    if (typeof g.arrow === "string") {
+        dir = g.arrow.trim().toLowerCase();
     }
+    return GV2GML_DIRECTIONS.get(dir) ?? null;
 }
 /**
  * Reads whether yEd draws an edge curved: `smoothBends` rounds the bends of its `Line`, whose points run from the
@@ -368,10 +734,11 @@ function readYedCurve(g, put) {
  * Reads an element's label records: the first visible one with text; further visible ones are noted.
  * @param raw - the `LabelGraphics` value (one record or several)
  * @param writer - the writer
+ * @param node - whether the label is a node's: its `anchor` places it (`c`, `n`, `t`, `se`, ...)
  * @param put - receives the values
  * @param at - the sites
  */
-function readLabelGraphics(raw, writer, put, at) {
+function readLabelGraphics(raw, writer, node, put, at) {
     const visible = (Array.isArray(raw) ? raw : [raw]).filter((l) => isRec(l) && Number(l.visible) !== 0);
     const lg = visible.at(0);
     if (lg === undefined) {
@@ -382,12 +749,13 @@ function readLabelGraphics(raw, writer, put, at) {
         noteAt(at("label"), STYLE_ISSUE.EXTRA_LABELS, `${String(extra + 1)} labels`);
     }
     if (lg.text !== undefined) {
-        put("label", canonText(lg.text, at("label")));
+        put("label", writer.vocabulary === "graphviz" ? graphvizText(lg.text, at("label")) : canonText(lg.text, at("label")));
     }
     // the GML draft's `fill` is the text color; yEd's is the label's background box, its `color` the text color
     const yedLabel = writer.vocabulary === "yed" || YED_LABEL_KEYS.some((k) => Object.hasOwn(lg, k));
-    if (lg.color !== undefined) {
-        readColor(lg.color, "labelColor", null, writer, put, at);
+    if (lg.color !== undefined || lg.fontColor !== undefined) {
+        // gv2gml writes a label's fontcolor as fontColor (as color with -y); yEd's #RRGGBBAA alpha is the words'
+        readColor(lg.color ?? lg.fontColor, "labelColor", "labelOpacity", writer, put, at);
     }
     else if (lg.fill !== undefined && !yedLabel) {
         readColor(lg.fill, "labelColor", null, writer, put, at);
@@ -395,17 +763,39 @@ function readLabelGraphics(raw, writer, put, at) {
     if (lg.fill !== undefined && yedLabel) {
         noteAt(at("label"), STYLE_ISSUE.NOT_CARRIED, "label background");
     }
-    readLabelFont(lg, put, at);
+    // yEd and Cytoscape are Java programs: a Java logical font (Dialog, SansSerif, ...) is drawn in Java's face for it
+    readLabelFont(lg, yedLabel || writer.vocabulary === "cytoscape", put, at);
+    if (node && lg.anchor !== undefined) {
+        const anchor = scalarText(lg.anchor, at("labelPosition"))?.trim().toLowerCase() ?? "";
+        const known = GML_ANCHORS.get(anchor);
+        if (known === undefined) {
+            noteAt(at("labelPosition"), STYLE_ISSUE.UNKNOWN_VALUE, anchor.slice(0, MAX_STYLE_VALUE_LENGTH));
+        }
+        put("labelPosition", known ?? null);
+    }
+}
+/**
+ * A label's text as Graphviz draws it: gv2gml copies a DOT label as written, so its line breaks are still the escapes
+ * `\n`, `\l` and `\r` (centered, left and right lines, drawn here as plain line breaks).
+ * @param raw - the text
+ * @param at - the site
+ * @returns the text
+ */
+function graphvizText(raw, at) {
+    const text = canonText(raw, at);
+    return text === null ? null : text.replaceAll(/\\[nlr]/g, "\n").replace(/\n$/, "");
 }
 /**
  * Reads a label record's font: its size, name, weight and slant.
  * @param lg - the record
+ * @param java - whether a Java program wrote it, whose logical font names are drawn in Java's faces
  * @param put - receives the values
  * @param at - the sites
  */
-function readLabelFont(lg, put, at) {
+function readLabelFont(lg, java, put, at) {
     put("labelSize", lg.fontSize === undefined ? null : canonNumber(lg.fontSize, at("labelSize")));
-    put("labelFont", lg.fontName === undefined ? null : canonText(lg.fontName, at("labelFont")));
+    const font = lg.fontName === undefined ? null : canonText(lg.fontName, at("labelFont"));
+    put("labelFont", java && typeof font === "string" ? javaFamily(font) : font);
     const style = scalarText(lg.fontStyle, at("labelWeight"))?.trim().toLowerCase();
     if (style !== undefined) {
         const known = FONT_STYLES.get(style);
@@ -438,13 +828,81 @@ function readElement(target, g, lg, label, writer, put, at) {
         (target === "node" ? readNodeGraphics : readEdgeGraphics)(g, writer, put, at);
     }
     if (lg !== null && lg !== undefined) {
-        readLabelGraphics(lg, writer, putLabel, at);
+        readLabelGraphics(lg, writer, target === "node", putLabel, at);
     }
     // the GML draft draws the label key; Cytoscape reads it as the node's name, which its default style shows
     const drawn = writer.vocabulary === "cytoscape" ? target === "node" : writer.labelKey && (isRec(g) || lg !== undefined);
     if (!text && drawn && label !== null && label !== undefined) {
-        put("label", canonText(label, at("label")));
+        put("label", writer.vocabulary === "graphviz" ? graphvizText(label, at("label")) : canonText(label, at("label")));
+        // the GML draft names no place for a node's label; a plain GML file's is centered on its node, as OGDF and
+        // Cytoscape draw it (yEd's GML keeps its own label models, in LabelGraphics)
+        if (target === "node" && writer.tool === null && writer.vocabulary === "graphlet") {
+            put("labelPosition", "center");
+        }
+    }
+}
+/** The font size GraphIO::drawSVG draws every label in (SVGSettings), by which it sets a cluster's label off its box. */
+const OGDF_SVG_FONT_SIZE = 10;
+/**
+ * Places each OGDF cluster's label where GraphIO::drawSVG draws it (SvgPrinter::drawCluster): one font size below the
+ * cluster's box where more of the drawing lies below it than above, else above it; starting at the box's left side
+ * where more of the drawing lies left of it than right, else ending at its right side. The importer reads a cluster as
+ * a group node with the id `cluster<id>`; its box is its center and its `w` and `h`.
+ * @param snapshot - the graph
+ * @param values - the node values read so far, given the label's place
+ */
+function placeOgdfClusterLabels(snapshot, values) {
+    const n = snapshot.nodeCount;
+    const boxOf = (i) => {
+        const [x, y] = centerOf(snapshot, i);
+        const [w, h] = sizeOf(snapshot, i);
+        return [x - w / 2, y - h / 2, x + w / 2, y + h / 2];
+    };
+    // ponytail: drawSVG's bounding box also holds the edges' bends; nodes and clusters decide every sheet so far
+    const all = [Infinity, Infinity, -Infinity, -Infinity];
+    for (let i = 0; i < n; i++) {
+        const b = boxOf(i);
+        if (b.every(Number.isFinite)) {
+            all[0] = Math.min(all[0], b[0]);
+            all[1] = Math.min(all[1], b[1]);
+            all[2] = Math.max(all[2], b[2]);
+            all[3] = Math.max(all[3], b[3]);
+        }
+    }
+    const put = (property, i, value) => {
+        values[property] ?? (values[property] = new Array(n).fill(null));
+        values[property][i] = value;
+    };
+    for (let i = 0; i < n; i++) {
+        const id = snapshot.ids.idOf(i);
+        const [x0, y0, x1, y1] = boxOf(i);
+        if (typeof id !== "string" || !id.startsWith("cluster") || ![x0, y0, x1, y1].every(Number.isFinite)) {
+            continue;
+        }
+        const below = all[3] - y1 > y0 - all[1];
+        const start = x0 - all[0] > all[2] - x1;
+        put("labelPosition", i, "center");
+        put("labelOffsetX", i, ((start ? -1 : 1) * (x1 - x0)) / 2);
+        put("labelShiftX", i, start ? 0.5 : -0.5);
+        put("labelOffsetY", i, (below ? 1 : -1) * ((y1 - y0) / 2 + OGDF_SVG_FONT_SIZE));
+    }
+}
+/**
+ * An element's `label` key. Cytoscape's GML reader names a node by its label and, where the label is empty or
+ * missing, by its id, and its default style draws that name.
+ * @param snapshot - the graph
+ * @param writer - the writer
+ * @param target - nodes or edges
+ * @param i - the row
+ * @returns the label
+ */
+function labelOf(snapshot, writer, target, i) {
+    const table = target === "node" ? snapshot.nodes : snapshot.edges;
+    const label = cellOf(table, "label", i);
+    if (writer.vocabulary === "cytoscape" && target === "node" && (label === undefined || label === "")) {
+        return String(snapshot.ids.idOf(i));
     }
+    return label;
 }
 /**
  * The value of a column, or undefined when the table has no such column.
@@ -472,20 +930,180 @@ function centerOf(snapshot, i) {
     return v === null ? [Number.NaN, Number.NaN] : [v[0], v[1]];
 }
 /**
- * An edge's bends: the points of its `graphics` `Line` between the first and the last, which are where it leaves
- * the source and meets the target.
+ * A node's width and height: its `graphics` `w` and `h`.
+ * @param snapshot - the graph
+ * @param i - the node's index
+ * @returns the size; NaN where the node has none
+ */
+function sizeOf(snapshot, i) {
+    const g = cellOf(snapshot.nodes, "graphics", i);
+    return isRec(g) ? [Number(g.w ?? Number.NaN), Number(g.h ?? Number.NaN)] : [Number.NaN, Number.NaN];
+}
+/**
+ * An edge's route from its `graphics` `Line`, whose first and last points are where it attaches to its source and
+ * target (its ports: the centers unless yEd moved them) and whose points between are its bends: the bends relative to
+ * the two node centers (a self-loop's to its node's size), and each port off its node's center relative to the node.
+ * OGDF's `Line` holds the bends alone (GraphIO::writeGML writes no end point).
  * @param snapshot - the graph
  * @param g - the edge's `graphics` value
  * @param e - the edge's row
- * @returns the `bends` value, or null without bends
+ * @param bendsOnly - whether the points are the bends alone (OGDF)
+ * @param put - receives the values
  */
-function lineBends(snapshot, g, e) {
+function readLineRoute(snapshot, g, e, bendsOnly, put) {
     const raw = isRec(g) && isRec(g.Line) ? g.Line.point : undefined;
-    if (!Array.isArray(raw) || raw.length < 3) {
-        return null;
+    const list = isRec(raw) ? [raw] : raw;
+    if (!Array.isArray(list) || list.length < (bendsOnly ? 1 : 2)) {
+        return;
+    }
+    const all = list.map((p) => (isRec(p) ? [Number(p.x), Number(p.y)] : [Number.NaN, 0]));
+    const [s, t] = [snapshot.edgeSource(e), snapshot.edgeTarget(e)];
+    const points = bendsOnly ? all : all.slice(1, -1);
+    const bends = s === t
+        ? canonNodeOffsets(centerOf(snapshot, s), sizeOf(snapshot, s), points, true)
+        : canonBends(centerOf(snapshot, s), centerOf(snapshot, t), points, true);
+    if (bends !== null) {
+        put("bends", bends);
+    }
+    if (bendsOnly) {
+        return;
+    }
+    for (const [property, k, end] of [
+        ["sourcePort", s, all[0]],
+        ["targetPort", t, all.at(-1) ?? all[0]],
+    ]) {
+        const center = centerOf(snapshot, k);
+        const port = end[0] === center[0] && end[1] === center[1]
+            ? null
+            : canonNodeOffsets(center, sizeOf(snapshot, k), [end], true);
+        if (port !== null) {
+            put(property, port);
+        }
+    }
+}
+/**
+ * A gv2gml edge's route: its `Line` is the edge's Graphviz `pos`, the B-spline's `3n + 1` control points from the tail
+ * to the head (y up), with the arrow tips Graphviz keeps apart (`s,` and `e,`) written as plain first and last points;
+ * the points beyond `3n + 1` are those tips (the source's first when there are two or it has the arrow). A route on
+ * the line between the centers is the straight edge it looks like and gives no bends.
+ * @param snapshot - the graph
+ * @param g - the edge's `graphics` value
+ * @param e - the edge's row
+ * @param put - receives the values
+ */
+function readGv2gmlRoute(snapshot, g, e, put) {
+    const raw = isRec(g) && isRec(g.Line) ? g.Line.point : undefined;
+    const list = isRec(raw) ? [raw] : raw;
+    if (!Array.isArray(list) || !isRec(g)) {
+        return;
+    }
+    let points = list.map((p) => (isRec(p) ? [Number(p.x), Number(p.y)] : [Number.NaN, 0]));
+    const tips = (points.length - 1) % 3;
+    const sourceTip = tips === 2 || (tips === 1 && gv2gmlArrowEnds(g, snapshot.directed)?.[0] === true);
+    points = points.slice(sourceTip ? 1 : 0, points.length - (tips === 2 || (tips === 1 && !sourceTip) ? 1 : 0));
+    const bends = graphvizRouteBends(centerOf(snapshot, snapshot.edgeSource(e)), centerOf(snapshot, snapshot.edgeTarget(e)), [points]);
+    if (bends !== null) {
+        put("bends", bends);
+    }
+}
+/**
+ * Where graphty-element hangs an edge's label on a route drawn through these points (its centers and bends): the
+ * middle of its middle segment, or the joint between its two middle ones; `labelOffsetX` / `labelOffsetY` move it
+ * from there.
+ * @param points - the route, from the source's center to the target's
+ * @returns the point
+ */
+function routeMiddle(points) {
+    const m = points.length - 1;
+    if (m % 2 === 0) {
+        return points[m / 2];
+    }
+    const [a, b] = [points[(m - 1) / 2], points[(m + 1) / 2]];
+    return [(a[0] + b[0]) / 2, (a[1] + b[1]) / 2];
+}
+/**
+ * Puts an edge label's offset from where graphty-element hangs it, when the program draws it elsewhere.
+ * @param at - the label's center, in the file's coordinates
+ * @param middle - where graphty-element hangs it, in the same coordinates
+ * @param yUp - whether the file's y grows upward
+ * @param put - receives the values
+ */
+function putEdgeLabelOffset(at, middle, yUp, put) {
+    const dx = num6(at[0] - middle[0]);
+    const dy = num6((yUp ? -1 : 1) * (at[1] - middle[1]));
+    if (Number.isFinite(dx) && Number.isFinite(dy) && (dx !== 0 || dy !== 0)) {
+        // moved from the line's middle itself, not from graphty's default place beside the line
+        put("labelPosition", "center");
+        put("labelOffsetX", dx);
+        put("labelOffsetY", dy);
+    }
+}
+/**
+ * A gv2gml edge label's place: gv2gml copies Graphviz's `lp` (the label's center, in points, y up) as a plain edge
+ * key, and Graphviz draws the label there, beside its line rather than on it.
+ * @param snapshot - the graph
+ * @param e - the edge's row
+ * @param bent - whether its route has bends
+ * @param put - receives the values
+ */
+function readGv2gmlLabelPlace(snapshot, e, bent, put) {
+    const lp = cellOf(snapshot.edges, "lp", e);
+    const m = typeof lp === "string" ? /^\s*(-?[\d.]+)\s*,\s*(-?[\d.]+)\s*$/.exec(lp) : null;
+    // ponytail: a curved route's middle is where graphty-element samples its curve; only a straight one is placed
+    if (m === null || bent) {
+        return;
+    }
+    const [s, t] = [centerOf(snapshot, snapshot.edgeSource(e)), centerOf(snapshot, snapshot.edgeTarget(e))];
+    putEdgeLabelOffset([Number(m[1]), Number(m[2])], routeMiddle([s, t]), true, put);
+}
+/**
+ * An OGDF edge label's place: GraphIO::drawSVG (SvgPrinter::drawEdge) draws it at the middle of the route's first
+ * segment, from the source's center to its first bend, not at the route's middle.
+ * @param snapshot - the graph
+ * @param g - the edge's `graphics` value
+ * @param e - the edge's row
+ * @param put - receives the values
+ */
+function readOgdfLabelPlace(snapshot, g, e, put) {
+    const raw = isRec(g) && isRec(g.Line) ? g.Line.point : undefined;
+    const list = isRec(raw) ? [raw] : raw;
+    const [s, t] = [centerOf(snapshot, snapshot.edgeSource(e)), centerOf(snapshot, snapshot.edgeTarget(e))];
+    if (!Array.isArray(list) || snapshot.edgeSource(e) === snapshot.edgeTarget(e)) {
+        return;
+    }
+    const same = (a, b) => Math.hypot(a[0] - b[0], a[1] - b[1]) < 1e-6;
+    // the Line OGDF writes may start and end at the centers
+    const bends = list
+        .map((p) => (isRec(p) ? [Number(p.x), Number(p.y)] : [Number.NaN, 0]))
+        .filter((p) => !same(p, s) && !same(p, t));
+    if (bends.length === 0) {
+        return;
+    }
+    const route = [s, ...bends, t];
+    putEdgeLabelOffset([(route[0][0] + route[1][0]) / 2, (route[0][1] + route[1][1]) / 2], routeMiddle(route), false, put);
+}
+/**
+ * Hides the edges Gephi's own GML importer leaves out: an edge whose `directed` key disagrees with the graph's
+ * `directed` header (Gephi 0.11 loads 4 of `specimen-arrows-p6`'s 5 edges). A file with no header is read as mixed and
+ * every edge is loaded. The edge and its data stay; Gephi draws nothing there, so graphty draws nothing.
+ * @param snapshot - the graph
+ * @param values - the edge values read so far, given `visible`
+ */
+function hideGephiDroppedEdges(snapshot, values) {
+    const header = snapshot.meta.extra.gml?.directed;
+    const directed = snapshot.edges.byRole("directed");
+    // with no `directed` header Gephi reads a mixed graph and loads every edge (Gephi Toolkit 0.11.3, checked)
+    if (directed === null || header === undefined) {
+        return;
+    }
+    const graphDirected = Number(header) === 1;
+    for (let e = 0; e < snapshot.edgeCount; e++) {
+        const v = plainCell(directed.value(e));
+        if (typeof v === "boolean" && v !== graphDirected) {
+            values.visible ?? (values.visible = new Array(snapshot.edgeCount).fill(null));
+            values.visible[e] = false;
+        }
     }
-    const points = raw.slice(1, -1).map((p) => (isRec(p) ? [Number(p.x), Number(p.y)] : [Number.NaN, 0]));
-    return canonBends(centerOf(snapshot, snapshot.edgeSource(e)), centerOf(snapshot, snapshot.edgeTarget(e)), points, true);
 }
 /**
  * Every element's values, read with a writer's vocabulary.
@@ -507,18 +1125,33 @@ function readValues(snapshot, writer, notes, context) {
         for (let i = 0; i < n; i++) {
             context.budget.spend(target, 1);
             const at = (property) => ({ notes, target, property, element: i, budget: context.budget });
-            readElement(target, cellOf(table, "graphics", i), cellOf(table, "LabelGraphics", i), cellOf(table, "label", i), writer, (property, value) => {
+            readElement(target, cellOf(table, "graphics", i), cellOf(table, "LabelGraphics", i), labelOf(snapshot, writer, target, i), writer, (property, value) => {
                 if (value !== null) {
                     found = true;
                     out.put(i, property, value);
                 }
             }, at);
-            if (target === "edge") {
-                const bends = lineBends(snapshot, cellOf(table, "graphics", i), i);
-                if (bends !== null) {
+            if (target === "edge" && writer.vocabulary === "graphviz") {
+                let bent = false;
+                readGv2gmlRoute(snapshot, cellOf(table, "graphics", i), i, (property, value) => {
                     found = true;
-                    out.put(i, "bends", bends);
-                }
+                    bent || (bent = property === "bends");
+                    out.put(i, property, value);
+                });
+                readGv2gmlLabelPlace(snapshot, i, bent, (property, value) => {
+                    out.put(i, property, value);
+                });
+            }
+            else if (target === "edge" && writer.vocabulary === "ogdf") {
+                readOgdfLabelPlace(snapshot, cellOf(table, "graphics", i), i, (property, value) => {
+                    out.put(i, property, value);
+                });
+            }
+            if (target === "edge" && writer.vocabulary !== "graphviz") {
+                readLineRoute(snapshot, cellOf(table, "graphics", i), i, writer.vocabulary === "ogdf", (property, value) => {
+                    found = true;
+                    out.put(i, property, value);
+                });
             }
         }
         return out.values;
@@ -589,8 +1222,11 @@ function styleColumns(table) {
  */
 export function gmlStyles(snapshot, context) {
     const notes = new StyleNotes();
-    const writer = writerOf(snapshot);
+    const writer = { ...writerOf(snapshot), directed: snapshot.directed };
     const values = readValues(snapshot, writer, notes, context);
+    if (writer.vocabulary === "ogdf") {
+        placeOgdfClusterLabels(snapshot, values.node);
+    }
     const blockText = graphText(snapshot, GML_STYLE_BLOCK_KEY);
     const block = blockText === null ? null : blockWithValues(snapshot, blockText);
     if (block !== null) {
@@ -599,16 +1235,33 @@ export function gmlStyles(snapshot, context) {
     if (writer.tool === null && !values.found && block === null) {
         return null;
     }
+    if (writer.tool === "gephi" && block === null) {
+        // Gephi draws every edge in its end nodes' mixed color (EdgeColor MIXED), whatever its own
+        delete values.edge.color;
+        // and as thick as its weight, the `value` Gephi writes, also where the reader kept `value` as plain data
+        if (snapshot.edges.byRole("weight") === null && snapshot.edges.has("value")) {
+            values.edge.width = Array.from({ length: snapshot.edgeCount }, (_, e) => {
+                const w = cellOf(snapshot.edges, "value", e);
+                if (typeof w !== "number" || !Number.isFinite(w)) {
+                    return null;
+                }
+                // a weight of 0 or below is drawn 1 wide, so the edge stays visible
+                return w > 0 ? w : 1;
+            });
+        }
+        hideGephiDroppedEdges(snapshot, values.edge);
+    }
+    const none = { rules: [], columns: new Map() };
     const gephi = writer.tool === "gephi"
-        ? gephiRules(snapshot, values.node.fill, values.edge.color, context.budget, values.edge.width)
-        : { rules: [], columns: new Map() };
+        ? gephiRules(snapshot, { fill: values.node.fill, width: values.node.width }, { color: values.edge.color, width: values.edge.width }, context.budget)
+        : { node: none, edge: none };
     return {
         canonical: true,
         dialect: writer.dialect,
         tool: writer.tool,
         units: writer.units,
-        node: { values: values.node },
-        edge: { values: values.edge, rules: gephi.rules, columns: gephi.columns },
+        node: { values: values.node, ...gephi.node },
+        edge: { values: values.edge, ...gephi.edge },
         notes: notes.list(),
         opacityInColor: true,
         block,
@@ -623,6 +1276,7 @@ export function gmlStyles(snapshot, context) {
  * @category Built-in formats
  */
 export const GML_STYLE_CAPABILITIES = Object.freeze({
+    tool: "yed",
     node: Object.freeze([
         "fill",
         "fillOpacity",
@@ -648,6 +1302,8 @@ export const GML_STYLE_CAPABILITIES = Object.freeze({
         "targetArrow",
         "curved",
         "bends",
+        "sourcePort",
+        "targetPort",
         "label",
         "labelColor",
         "labelSize",
@@ -797,7 +1453,8 @@ function labelGraphics(get) {
     }
     const font = get("labelFont");
     if (typeof font === "string") {
-        lg.fontName = font;
+        // a Java face is written back as the logical font yEd draws in it
+        lg.fontName = yedFontName(font);
     }
     const weight = get("labelWeight");
     const italic = get("labelItalic");
@@ -841,19 +1498,6 @@ function mergedLabels(old, written) {
     }
     return head === undefined ? rest : [head, ...rest];
 }
-/**
- * Each element's values of the properties the writer writes, as a getter per element.
- * @param picture - each element's value of a property
- * @param target - nodes or edges
- * @returns the getter
- */
-function getter(picture, target) {
-    const columns = new Map();
-    for (const p of GML_STYLE_CAPABILITIES[target]) {
-        columns.set(p, picture(target, p));
-    }
-    return (i) => (property) => columns.get(property)?.[i] ?? null;
-}
 /**
  * For a file graphty wrote: where a value read from the graphics is what the writer writes for the block's own value
  * (a pentagon written as a rectangle, an opacity rounded to 255 steps), the block's exact value is the truth, so a
@@ -865,29 +1509,16 @@ function getter(picture, target) {
  * @param read.edge - the edge values
  */
 function exactFromBlock(snapshot, text, read) {
-    const parsed = parseStyleBlock(text, styleFingerprint(snapshot));
-    const ex = parsed.ok ? blockStyles(parsed.block, snapshot, "gml") : null;
-    if (ex === null) {
-        return;
-    }
     const notes = new StyleNotes();
-    for (const target of ["node", "edge"]) {
-        const n = target === "node" ? snapshot.nodeCount : snapshot.edgeCount;
-        const get = getter((t, p) => resolveStyles(ex, t, p, snapshot), target);
-        const values = read[target];
-        for (let i = 0; i < n; i++) {
-            const want = get(i);
+    takeFromBlock(snapshot, text, "gml", (target) => ({
+        values: read[target],
+        properties: GML_STYLE_CAPABILITIES[target],
+        writes: GML_STYLE_CAPABILITIES[target],
+        readBack: (_i, want) => {
             const back = writtenAndReadBack(target, want, notes);
-            for (const property of GML_STYLE_CAPABILITIES[target]) {
-                const native = values[property]?.[i] ?? null;
-                const w = want(property);
-                if (native !== w && native === (back.get(property) ?? null)) {
-                    values[property] ?? (values[property] = new Array(n).fill(null));
-                    values[property][i] = w;
-                }
-            }
-        }
-    }
+            return (property) => back.get(property) ?? null;
+        },
+    }));
 }
 /**
  * An element's values written as the writer writes them and read back as the reader reads them.
@@ -968,13 +1599,18 @@ function writeGraphicsColumns(snapshot, input, target, table, approximated) {
     const approximate = (property, value) => {
         approximated.add(target, property, value);
     };
-    const get = getter((t, p) => input.picture(t, p), target);
+    const get = elementValues((t, p) => input.picture(t, p), target, GML_STYLE_CAPABILITIES[target]);
+    const getNode = elementValues((t, p) => input.picture(t, p), "node", GML_STYLE_CAPABILITIES.node);
+    const size = (k) => {
+        const [w, h] = [getNode(k)("width"), getNode(k)("height")];
+        return typeof w === "number" && typeof h === "number" ? [w, h] : sizeOf(snapshot, k);
+    };
     const graphics = [];
     const labels = [];
     for (let i = 0; i < n; i++) {
         const g = target === "node" ? nodeGraphics(get(i), approximate) : edgeGraphics(get(i), approximate);
         if (target === "edge") {
-            const line = bendsLine(snapshot, get(i)("bends"), i);
+            const line = routeLine(snapshot, get(i), i, size);
             if (line !== null) {
                 g.Line = line;
             }
@@ -995,21 +1631,38 @@ function writeGraphicsColumns(snapshot, input, target, table, approximated) {
     }
 }
 /**
- * An edge's `Line` from its `bends` value: the node centers it is written between, with the bends placed between them,
- * so the bends read back as written.
+ * An edge's `Line` from its `bends`, `sourcePort` and `targetPort` values: from its source port (the node's center
+ * without one) through the bends placed between the node centers (a self-loop's around its node) to its target port,
+ * so the route reads back as written.
  * @param snapshot - the graph handed to the exporter
- * @param bends - the edge's `bends` value
+ * @param get - the edge's values
  * @param e - the edge's row
+ * @param size - each node's written width and height
  * @returns the `Line` record, or null without a value or without both centers
  */
-function bendsLine(snapshot, bends, e) {
-    const source = centerOf(snapshot, snapshot.edgeSource(e));
-    const target = centerOf(snapshot, snapshot.edgeTarget(e));
-    const points = typeof bends === "string" ? bendsToPoints(source, target, bends, true) : null;
-    if (points === null || ![...source, ...target].every(Number.isFinite)) {
+function routeLine(snapshot, get, e, size) {
+    const [s, t] = [snapshot.edgeSource(e), snapshot.edgeTarget(e)];
+    const source = centerOf(snapshot, s);
+    const target = centerOf(snapshot, t);
+    if (![...source, ...target].every(Number.isFinite)) {
+        return null;
+    }
+    const bends = get("bends");
+    let points = null;
+    if (typeof bends === "string") {
+        points =
+            s === t ? nodeOffsetsToPoints(source, size(s), bends, true) : bendsToPoints(source, target, bends, true);
+    }
+    const port = (property, k, center) => {
+        const value = get(property);
+        return typeof value === "string" ? (nodeOffsetsToPoints(center, size(k), value, true)?.[0] ?? null) : null;
+    };
+    const from = port("sourcePort", s, source);
+    const to = port("targetPort", t, target);
+    if (points === null && from === null && to === null) {
         return null;
     }
-    return { point: [source, ...points, target].map(([x, y]) => ({ x, y })) };
+    return { point: [from ?? source, ...(points ?? []), to ?? target].map(([x, y]) => ({ x, y })) };
 }
 /**
  * Writes a data column under a name out of the keys the style values take.