[OpenLayers-Users] ModifyControl Select/Delete Vertex?

Robert Smart r_n_smart at hotmail.com
Fri Mar 1 07:00:43 PST 2013


And I’ve also just figured out that if you delete a vertex using my code, it stops responding to the click event, but if you then drag that point, it will start responding again.

So it looks like dragging it somehow resets the event handler?

From: Alexandre Dubé 
Sent: Friday, March 01, 2013 2:28 PM
To: openlayers-users at lists.osgeo.org 
Subject: Re: [OpenLayers-Users] ModifyControl Select/Delete Vertex?

Just out of curiosity, you could try with OpenLayers trunk (master branch on GitHub) to see if this issue has already been fixed.

Alexandre


On 13-03-01 09:26 AM, Alexandre Dubé wrote:

  Hey Rob,

    Looking deeper, I may have found part of the issue.  If you put a breakpoint in the OpenLayers.Handler.Feature, line 353 :

      if(dpx <= this.clickTolerance) {
          this.callback(key, args);
      }

    you'll notice that the feature handler stop at this point.  The callback method isn't called, thus resulting in our registered 'click' callback we made not being fired, nor the original one from the DragControl.  The dpx is greater than the clickTolerance, that's the problem.  The 'up' and 'down' positions seem erroneous, and I don't understand what's the cause.

    I think we'll need an OpenLayers dev answer, but this may be a bug, or a consequence of something we do incorrectly.

  Regards,

  Alexandre


  On 13-03-01 09:15 AM, Alexandre Dubé wrote:

    Hi Rob,

      I look and haven't found what's causing the issue, but here's some updates anyway:

      You shouldn't set the standalone property after the instantiation of the modify control.  If you look at the code, that property is used in the initialize function.

      I noticed that the DragControl already has a 'click' callback method, so the way I suggested currently overrides it completely.  Making the following change makes the chain continue: 

        click: function(feature) {
            this.layer.events.triggerEvent(
                "vertexclicked", {feature: feature}
            )
            // call the dragControl original click callback method
            control.dragControl.clickFeature.apply(
                control.dragControl, [feature]);
        }

      Even with the above fix, I notice that the callback method is never triggered. The feature handler is still active though. I don't know what's wrong. This may be an issue in OpenLayers.

    Regards,

    Alexandre


    On 13-03-01 07:26 AM, Robert Smart wrote:

      Hi,

      I’ve made a start on modifying the code so it does what i need. However I need it work in standalone mode, and it seems to exhibit some odd behaviour.

      If I start editing and selecting points it all works fine, but if I click outside of the polygon (it remains editable since it is in standalone mode)when I go back to the polygon the click event no longer fires, so I can no longer select a vertex. 

      Any ideas what might be causing this?

      I’ve pasted the page code below. I have not changed the modifyFeatureVertexSelection code at all except putting it in a seperate js file.

      Thanks,

      Rob Smart

      <div id="map" style="width:500px; height:500px; " ></div>
            <input id="Button4" type="button" value="Delete Selected Vertex" onclick="deleteSelectedVertex()" />

         <script type="text/javascript">

         var map, vectors, modify, feature, selectedVertex;

         $(document).ready(function () {

             map = new OpenLayers.Map('map');
             var wms = new OpenLayers.Layer.WMS("OpenLayers WMS",
             "http://vmap0.tiles.osgeo.org/wms/vmap0?", { layers: 'basic' });
             OpenLayers.Feature.Vector.style['default']['strokeWidth'] = '2';

             // allow testing of specific renderers via "?renderer=Canvas", etc
             var renderer = OpenLayers.Util.getParameters(window.location.href).renderer;
             renderer = (renderer) ? [renderer] : OpenLayers.Layer.Vector.prototype.renderers;

             var style = $.extend(true, {}, OpenLayers.Feature.Vector.style['default']); // get a copy of the default style
             style.fillColor = "Red";
             style.fillOpacity = 1;

             var myStyleMap = new OpenLayers.StyleMap({
                 "temporary": new OpenLayers.Style(style)
             });

             vectors = new OpenLayers.Layer.Vector("Vector Layer", {
                 renderers: renderer, styleMap: myStyleMap
             });

             map.addLayers([wms, vectors]);


             feature = new OpenLayers.Feature.Vector(
             OpenLayers.Geometry.Polygon.createRegularPolygon(
                 new OpenLayers.Geometry.Point(0, 0),
                 10,
                 5
             ),
             {}
         );
             vectors.addFeatures([feature]);

             if (console && console.log) {
                 // register a callback function to our new "vertexclicked" event
                 vectors.events.on({ "vertexclicked": function report(event) {
                     console.log(event.type, event.feature.id);

                     myVertices = feature.geometry.getVertices();
                     realVertex = false;

                     //TEST TO SEE IF ITS A REAL VERTEX
                     for (var i = 0; i < myVertices.length; i++) {
                         //console.log(myVertices[i]);

                         if (myVertices[i] == event.feature.geometry) { realVertex = true; }
                         //Do something
                     }

                     if (realVertex == false) { console.log("virtualVertex"); return; }

                     console.log(event.feature)


                     if (selectedVertex == null) {
                         selectedVertex = event.feature;
                         vectors.drawFeature(event.feature, "temporary");
                         return;
                     }

                     if (event.feature == selectedVertex) {
                         vectors.drawFeature(event.feature, "default");
                         selectedVertex = null;
                         return;
                     }

                     if (event.feature != selectedVertex) {
                         vectors.drawFeature(selectedVertex, "default");
                         selectedVertex = event.feature;
                         vectors.drawFeature(event.feature, "temporary");
                     }

                     // change the color - sure !


                     //                // do more - popup to delete the vertex
                     //                c = [];
                     //                c.push("Selected feature id: ");
                     //                c.push(vectors.selectedFeatures[0].id);
                     //                c.push("\nSelected vertex id: ");
                     //                c.push(event.feature.id);
                     //                c.push("\n\nRemove this vertex?")
                     //                var removeVertex = confirm(c.join(""));

                     //                if (removeVertex) {
                     //                    // I noticed that the ModifyFeature control doesn't have
                     //                    // a method to manage a vertices removal, it's only done inside
                     //                    // the 'handleKeypress' callback method... but it doesn't
                     //                    // prevent us from using it :) so we'll emulate a 'delete' key
                     //                    // pressed
                     //                    modify.dragControl.feature = event.feature;
                     //                    modify.handleKeypress({ keyCode: 46 });
                     //                } else {
                     //                    // simply redraw the vertex back to its default style
                     //                    vectors.drawFeature(event.feature, "default");
                     //                }
                 }
                 });
             }

             modify = new OpenLayers.Control.ModifyFeatureVertexClick(vectors);
             modify.standalone = true;
             map.addControls([modify]);
             modify.activate();

             map.setCenter(new OpenLayers.LonLat(0, 0), 3);

             // select with a delay to let the map render and apply the default style
             // to the feature, which emulates a selection that would be made using a
             // click on the feature
             setTimeout(function () {
                 modify.selectControl.select(feature);
             });

         });

         function deleteSelectedVertex() {

             if (selectedVertex != null) { 
             modify.dragControl.feature = selectedVertex;
             modify.handleKeypress({ keyCode: 46 });
             //This works for some of the issues but not all of the them
             //vectors.destroyFeatures([selectedVertex])
             modify.dragControl.feature = null;
             selectedVertex = null;
             modify.selectControl.select(feature);

         }

         }
         
         </script>

      From: Alexandre Dubé 
      Sent: Thursday, February 28, 2013 7:05 PM
      To: Robert Smart 
      Cc: openlayers-users at lists.osgeo.org 
      Subject: Re: [OpenLayers-Users] ModifyControl Select/Delete Vertex?

      Hi Robert,

        Yep, all the things you ask are quite possible but not without getting your hand a bit dirty :)  You can do all that by programming.  Extend the ModifyControl more to make it do what you want.  Don't be afraid to look at the source code to see what the components do.  You'll get more knowledge that way.

        I'd be happy to see the end result.  Best of luck to you.

      Kind regards,

      Alexandre

        

      On 13-02-28 12:36 PM, Robert Smart wrote:



        This there a way to define a style for the selected vertex? 

      Sure.  Look at the OpenLayers.Layer.Feature drawFeature method, second argument.




        Is there a way to store a reference to the selected vertex in the modify feature control? So that I could allow a user to select a vertex and then if they choose to delete it, I can just pull out a reference to it in the code from the modify feature. I suppose this could also just be a deleteSeletectedVertex function on the modifyFeature control too.

      Yep, but you'll need to program that.




        Is there a way to deselect the the vertex too? So if I click on it and it changes its style to the ‘selected’ style, I can then click on it again to deselect it?

      If you keep track of the current one selected, yeah you could.  This is also done programmatically.




-- 
Alexandre Dubé
Mapgears
www.mapgears.com



-- 
Alexandre Dubé
Mapgears
www.mapgears.com

     

_______________________________________________
Users mailing list
Users at lists.osgeo.org
http://lists.osgeo.org/mailman/listinfo/openlayers-users



-- 
Alexandre Dubé
Mapgears
www.mapgears.com

   

_______________________________________________
Users mailing list
Users at lists.osgeo.org
http://lists.osgeo.org/mailman/listinfo/openlayers-users



-- 
Alexandre Dubé
Mapgears
www.mapgears.com


--------------------------------------------------------------------------------
_______________________________________________
Users mailing list
Users at lists.osgeo.org
http://lists.osgeo.org/mailman/listinfo/openlayers-users
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.osgeo.org/pipermail/openlayers-users/attachments/20130301/22cf3167/attachment-0001.html>


More information about the Users mailing list