Les polygones disparaissent après étirage dans le plan des couches TMS

Question

Je suis très nouveau à OpenLayers, et je suis d'essayer couche TMS pour des images en mosaïque générées à l'aide GDAL2Tiles. les choses de base comme le panoramique / zoom fonctionne bien et maintenant je suis en train d'ajouter EditingToolbar et dessiner des polygones sur la carte. Dès que je dessine le polygone ou placez le point sur la carte, le polygone disparaît / points. Est-ce que je manque quelque chose? Comment puis-je débugger?

Voici mon code (je suis en train sur le code HTML généré par GDAL2Tiles).

<script type="text/javascript">

            var map;

            var mapBounds = new OpenLayers.Bounds( 0.0, -612.0, 857.0, 0.0);
            var mapMinZoom = 0;
            var mapMaxZoom = 2;

            // avoid pink tiles
            OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3;
            OpenLayers.Util.onImageLoadErrorColor = "transparent";

            function init(){
            var options = {
                controls: [],
                maxExtent: new OpenLayers.Bounds(  0.0, -612.0, 857.0, 0.0 ),
                maxResolution: 4.000000,
                numZoomLevels: 3
                };
            map = new OpenLayers.Map('map', options);

            var layer = new OpenLayers.Layer.TMS( "TMS Layer","",
                {  url: '', serviceVersion: '.', layername: '.', alpha: true,
                    type: 'png', getURL: overlay_getTileURL
                });
            map.addLayer(layer);
            map.zoomToExtent( mapBounds );   

            map.addControl(new OpenLayers.Control.PanZoomBar());
            map.addControl(new OpenLayers.Control.MousePosition());
            map.addControl(new OpenLayers.Control.MouseDefaults());
            map.addControl(new OpenLayers.Control.KeyboardDefaults());

        var vlayer = new OpenLayers.Layer.Vector( "Editable" );

        map.addControl(new OpenLayers.Control.EditingToolbar(vlayer));

        }

        function overlay_getTileURL(bounds) {
            var res = this.map.getResolution();
            var x = Math.round((bounds.left - this.maxExtent.left) / (res * this.tileSize.w));
            var y = Math.round((bounds.bottom - this.maxExtent.bottom) / (res * this.tileSize.h));
            var z = this.map.getZoom();
            if (x >= 0 && y >= 0) {
                return this.url + z + "/" + x + "/" + y + "." + this.type;               
            } else {
                return "http://www.maptiler.org/img/none.png";
            }
        }


        </script>

Answer 1

Vous devez ajouter la couche vectorielle à la carte ainsi.

var vlayer = new OpenLayers.Layer.Vector( "Editable" );
map.addLayer(vlayer); // HERE
map.addControl(new OpenLayers.Control.EditingToolbar(vlayer));