在 Seed Rust 应用程序中为 SVG 文本元素调用 getBBox

Posted 2023-02-19

【中文标题】在 Seed Rust 应用程序中为 SVG 文本元素调用 getBBox

【英文标题】：Calling getBBox for a SVG text element in a Seed Rust application

【发布时间】：2021-03-11 20:26:54

【问题描述】：

我刚刚使用 WASM 和 Seed 迈出了第一步，到目前为止，这是一次非常顺利的体验。我能够使用svg!、circle!、text!、...和类似的宏来创建 SVG。为了以正确的方式生成我的 SVG，我必须测量文本。我的想法是生成SVG文本节点并在节点上调用getBBox。我发现 Seed 正在使用 web_sys 和 getBBox is implemented there。

我的问题是如何从text! 创建的Node 到SvgTextElement。我试图访问node_ws 字段，但它似乎是“空的”。它可能尚未创建，但我现在对 Seed 的内部结构还不够了解。

那么如何创建一个 SVG 文本节点，以便在生成“主”SVG 节点之前对其调用 getBBox？

【参考方案1】：

您可以使用el_ref 来获取对DOM 元素的引用。像这样的东西应该可以工作：

struct Model 
    element: ElRef<web_sys::SvgTextElement>,


fn view(model: &Model) -> Node<Msg> 
    svg!![
        text![
            el_ref(&model.element),
            // ...
        ],
        // ...
    ]


fn init(orders: &mut impl Orders<Msg>) -> Model 
    orders.after_next_render(|_| Msg::Rendered);
    // ...


fn update(msg: Msg, model: &mut Model, orders: &mut impl Orders<Msg>) 
    match msg 
        Msg::Rendered => 
            let element = model.element.get().expect("no svg text element");
            let b_box = element.get_b_box();
            // ...
        
        // ...