Question

我正在尝试通过Branflake（或Branflake2267）GWT / Java库使用（非官方）Google Maps V3 JavaScript API。所有的基础库都已加载，我得到了标准的Google卫星图像，看起来没什么问题。

但是，现在，我想创建一个自定义地图类型（MapType），该地图类型提供自己的Element值以供显示。提供的ImageMapType和StyledMapType是不够的。

JavaScript库支持此功能，Google甚至在其文档中提供了example CoordMapType map。

我想知道如何使用Brandon Donnelson创建的GWT库来做这件事。

到目前为止我的尝试......

我尝试创建一个纯implements MapType的Java类，但它作为一个不正确的对象类型失败：

class FooMap implements MapType {...}

@com.google.gwt.maps.client.maptypes.MapTypeRegistry::set(Ljava/lang/String;Ljava/lang/Object;)([string:'FooID', Java object: com.example.FooMap@1360213231])
com.google.gwt.core.client.JavaScriptException: (Error)@com.google.gwt.core.client.impl.Impl::apply(Ljava/lang/Object;Ljava/lang/Object;Ljava/lang/Object;)([JavaScript object(44), JavaScript object(32), JavaScript object(46)]): Expected value implementing google.maps.MapType

我认为它必须是一个JavaScript对象，所以尝试扩展它，但它也失败了：

class FooMap extends JavaScriptObject implements MapType {...}

JavaScriptObject must be created from JavaScript.  [paraphrased]

我尝试通过JavaScript创建它，但没有运气：

static public FooMap newInstance(MapOptions options) {
     return createJso(options).cast();
}

static private final native JavaScriptObject createJso(MapOptions options) /*-{
    return new $wnd.google.maps.Map(document.getElementById('map-canvas'), options);
}-*/;

[ERROR] Line 296: Instance fields cannot be used in subclasses of JavaScriptObject

我删除了我的本地成员（不知道放在哪里，但至少我可以测试）但createJso()方法仍然会抛出异常：

com.google.gwt.core.client.JavaScriptException: (TypeError) @com.google.gwt.core.client.impl.Impl::apply(Ljava/lang/Object;Ljava/lang/Object;Ljava/lang/Object;)([JavaScript object(30), JavaScript object(32), JavaScript object(33)]): Cannot read property 'offsetWidth' of null

其中，我可以从其他帖子中看到，因为我还没有创建地图，因此我还没有创建地图画布元素......但这就是我想要做的。

我目前没有想法，所以认为这里的好人可能会有一些想法。如果我取得任何进展，我会添加更新（或者可能是答案＆lt;有希望的外观＆gt;）。

Answer 1

好的，这就是我完成它的方式。请注意，这只是实际Google地图的“平铺提供商”，而不是地图本身。

static public final class MyMap extends JavaScriptObject {
    // These are actually done through JSNI calls because JavaScriptObject
    // doesn't allow adding local member variables in derived classes.
    // "DisplayLayer" is my own details about how to display these map tiles.
    // @getter @setter private DisplayLayer displayLayer;
    // @getter @setter private String urlPrefix;

    protected MyMap() {}

    static public MyMap newInstance(MapOptions options, DisplayLayer layer) {
         MyMap map = createJso(options).cast();
         map.setDisplayLayer(layer);
         if (layer != null) {
             ...
         }
         return map;
    }

    static private native JavaScriptObject createJso(MapOptions options) /*-{
        var map = new Object();
        map.tileSize = new $wnd.google.maps.Size(256, 256);
        map.maxZoom = 31;
        map.getTile = function(point, zoom, owner) {
            return @com.example.project.MyMap::getTile(Lcom/google/gwt/core/client/JavaScriptObject;Lcom/google/gwt/maps/client/base/Point;ILcom/google/gwt/dom/client/Document;)(this, point, zoom, owner);
        };
        return map;
    }-*/;

    private native void setDisplayLayer(DisplayLayer layer) /*-{
        this.displayLayer = layer;
    }-*/;

    private native DisplayLayer getDisplayLayer() /*-{
        return this.displayLayer;
    }-*/;

    private native void setUrlPrefix(String prefix) /*-{
        this.urlPrefix = prefix;
    }-*/;

    private native String getUrlPrefix() /*-{
        return this.urlPrefix;
    }-*/;

    private native void setVisible(boolean visible) /*-{
        this.visible = visible;
    }-*/;

    private native boolean isVisible() /*-{
        return this.visible;
    }-*/;

    static public Element getTile(JavaScriptObject jsmap, Point point, int zoom, Document owner) {
        final MyMap map = jsmap.cast();
        final DisplayLayer dl = map.getDisplayLayer();
        final ImageElement img = owner.createImageElement();
        img.getStyle().setWidth(256, Style.Unit.PX);
        img.getStyle().setHeight(256, Style.Unit.PX);
        ... set img.src and various CSS styles based on display-layer ...
        return img;
    }
}

如何使用BranFlake GWT-Maps-V3 API创建自定义MapType？

1 个答案: