0

我在我的移动 JS (qooxdoo) 应用程序中使用 openlayers绘图示例，除了绘图光标在视口上方，我可以绘图，但我看不到光标，我只能在我之后看到绘图向下滚动。

我以这个qooxdoo 示例为基础。我还将 openlayers 示例中的所有 css 规则添加到我的 qooxdoo 样式中。

似乎是一个CSS位置问题，但我似乎找不到它。

任何帮助，将不胜感激。

     /**
     * Loads JavaScript library which is needed for the map.
     */
    _loadMapLibrary: function() {

        var self = this;
        var req = new qx.bom.request.Script();

        var options = {
            singleTile: true,
            ratio: 1,
            isBaseLayer: true,
            wrapDateLine: true,
            getURL: function() {
                var center = self._map.getCenter().transform("EPSG:3857", "EPSG:4326"),
                    size = self._map.getSize();
                return [
                this.url, "&center=", center.lat, ",", center.lon, "&zoom=", self._map.getZoom(), "&size=", size.w, "x", size.h].join("");
            }
        };

        req.onload = function() {
            var vector = new OpenLayers.Layer.Vector('Vector Layer', {
                styleMap: new OpenLayers.StyleMap({
                    temporary: OpenLayers.Util.applyDefaults({
                        pointRadius: 16
                    }, OpenLayers.Feature.Vector.style.temporary)
                })
            });

            // OpenLayers' EditingToolbar internally creates a Navigation control, we
            // want a TouchNavigation control here so we create our own editing toolbar
            var toolbar = new OpenLayers.Control.Panel({
                displayClass: 'olControlEditingToolbar'
            });
            toolbar.addControls([
            // this control is just there to be able to deactivate the drawing
            // tools
            new OpenLayers.Control({
                displayClass: 'olControlNavigation'
            }), new OpenLayers.Control.ModifyFeature(vector, {
                vertexRenderIntent: 'temporary',
                displayClass: 'olControlModifyFeature'
            }), new OpenLayers.Control.DrawFeature(vector, OpenLayers.Handler.Point, {
                displayClass: 'olControlDrawFeaturePoint'
            }), new OpenLayers.Control.DrawFeature(vector, OpenLayers.Handler.Path, {
                displayClass: 'olControlDrawFeaturePath'
            }), new OpenLayers.Control.DrawFeature(vector, OpenLayers.Handler.Polygon, {
                displayClass: 'olControlDrawFeaturePolygon'
            })]);

            var osm = new OpenLayers.Layer.OSM();
            osm.wrapDateLine = false;

            map = new OpenLayers.Map({
                div: 'googleMap',
                projection: 'EPSG:900913',
                numZoomLevels: 18,
                controls: [
                new OpenLayers.Control.TouchNavigation({
                    dragPanOptions: {
                        enableKinetic: true
                    }
                }), new OpenLayers.Control.Zoom(), toolbar],
                layers: [osm, vector],
                center: new OpenLayers.LonLat(0, 0),
                zoom: 1,
                theme: null
            });

            // activate the first control to render the "navigation icon"
            // as active
            toolbar.controls[0].activate();
        }

        req.open("GET", this._mapUri);
        req.send();
    },
4

1 回答 1

0

请检查光标类的 z-Index。最好的方法是通过 Chrome 的调试器控制台或 Firebug 来修改 z-Index。

是否有您的应用程序可用的实时示例？

于 2013-01-08T12:23:15.740 回答