// canvas.el — Full server-side pipeline: layout -> render -> SVG string. // // This is the primary integration point for callers that want a static SVG // without managing the layout and render steps separately. // // Public API: // graph_svg_endpoint(nodes_json, edges_json, width, height) -> String // Full pipeline: Coulomb/spring layout (150 iterations) -> SVG string. // Returns a complete ... string. // // Client-side interaction (drag, zoom, pan) is deferred until el-ui-compiler // gains a JavaScript backend. For now, all rendering is server-side. // Clients refresh the SVG on demand (e.g., polling GET /api/graph/svg). // // Zoom/pan note: SVG viewBox is fixed to [0,0,width,height]. When the JS // backend lands, el-ui-compiler will produce an overlay with pointer-event // handlers that transform a wrapper inside this SVG. The server-side path // stays as a fallback for non-browser consumers (CLI, PDF export, testing). fn layout_default_iterations() -> Int { 150 } // ── graph_svg_endpoint ──────────────────────────────────────────────────────── fn graph_svg_endpoint(nodes_json: String, edges_json: String, width: Int, height: Int) -> String { let w_f: Float = int_to_float(width) let h_f: Float = int_to_float(height) // Step 1: compute layout let positions_json: String = layout_run(nodes_json, edges_json, w_f, h_f, layout_default_iterations()) // Step 2: render to SVG let svg: String = graph_render_svg(nodes_json, edges_json, positions_json, width, height) svg } // ── graph_svg_endpoint_custom ───────────────────────────────────────────────── // // Same as above but with configurable iteration count. // Use when you need faster layout (low iters) or higher quality (high iters). fn graph_svg_endpoint_custom(nodes_json: String, edges_json: String, width: Int, height: Int, iterations: Int) -> String { let w_f: Float = int_to_float(width) let h_f: Float = int_to_float(height) let positions_json: String = layout_run(nodes_json, edges_json, w_f, h_f, iterations) graph_render_svg(nodes_json, edges_json, positions_json, width, height) }