制作一个简单的覆盖类？

Question

我想在 GWT 中制作一些非常简单的覆盖类来包装一些 SVG 内容。我基本上想绘制一个矩形，这就是我在 javascript 中所做的：

var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
svg.setAttribute('width', '100%');
svg.setAttribute('height', '100%');
document.body.appendChild(svg);

var rect = document.createElementNS('http://www.w3.org/2000/svg','rect');
rect.setAttribute("width","300");
rect.setAttribute("height","100");
svg.appendChild(rect);

现在我在将其转换为 GWT 时遇到了麻烦。我希望我可以在所有这些调用周围做一个非常薄的覆盖，就像这样：

public class SVGPanel extends JavaScriptObject {
    protected SVGPanel() {}

    public static native SVGPanel create(String width, String height) /*-{
        var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
        svg.setAttribute('width', width);
        svg.setAttribute('height', height);
        return svg;
    }-*/;
}

public MyProject implements EntryPoint {

    public void onModuleLoad() { 
        SVGPanel panel = SVGPanel.create("100%", "100%");
        Document.get().getBody().appendChild(panel);
    }
}

是的，但我不知道如何从 SVG 内容的 javascript 表示跳转到 GWT java 类。首先，SVGPanel 类扩展了 JavaScriptObject，但我不能简单地将其添加到 Document 主体类，因为它需要 Element 类型。如果有人能指出建造这座桥的正确方法，我应该能够继续前进。

另外，我不确定这是否是合并一些简单 SVG 类的最佳方法，我是否应该使用 DOM 类对它们进行建模，而不是尝试使用 JSNI ？

谢谢

Answer 1

您需要给appendChild一个Element。因此，只需让您的覆盖类扩展 Element 而不是 JavaScriptObject。

public class SVGPanel extends Element {

请注意，Element 是 JavaScriptObject 的子类。

Answer 2

我认为值得一看 gwt-svg - 虽然看起来他们停止了开发2007 年左右，代码库看起来足够可靠，很好地说明了你想要做什么，而且它还有一些不错的改进，比如针对（邪恶的）IE6 的特殊实现。即使代码不能按原样工作，希望它能给您一个开始的想法（也许您甚至可以将您的工作开源，以便其他人可以从中受益）。

还有 GWTCanvas - 这可能就是您想要的正在尝试实现:) 如果没有，至少值得检查一下他们的 API，看看他们是如何处理事情的。

祝你好运！