Deleting Features

188 views
Skip to first unread message

Jacob Fullerton

unread,
Jun 16, 2016, 5:34:19 PM6/16/16
to Tethys Platform
At the moment I have no way of deleting any elements except to refresh the page. How can I modify or make the drawing gizmos such that I can delete a feature by right clicking on it or something?

Thanks
6.16.16_Delete Features Question.PNG

Jacob Fullerton

unread,
Jun 17, 2016, 2:52:22 PM6/17/16
to Tethys Platform
I have discovered this code and it seems to work well for deleting features: map.getLayers().item(1).getSource().removeFeature(map.getLayers().item(1).getSource().getFeatures()[0])

The next step I have to figure out now is how to make this work so that the user can delete a feature by right clicking on the feature.

alansnow21

unread,
Jun 17, 2016, 3:05:55 PM6/17/16
to Tethys Platform
I would have a button to turn on/off deleting features by turning on/off selection interaction by using http://docs.tethysplatform.org/en/dev/tethys_sdk/gizmos/map_view.html#tethys-map-view-getmap to get the map and then:

map.removeInteraction(select_interaction);

map.addInteraction(select_interaction);

Then, when the feature is selected, try accessing the selected feature: http://docs.tethysplatform.org/en/dev/tethys_sdk/gizmos/map_view.html#tethys-map-view-getselectinteraction and see if you can delete it that way.


Jacob Fullerton

unread,
Jun 17, 2016, 3:07:55 PM6/17/16
to Tethys Platform
I also found this site just a little bit ago, taking a quick look at it: http://jsfiddle.net/jonataswalker/ooxs1w5d/

alansnow21

unread,
Jun 17, 2016, 3:16:51 PM6/17/16
to Tethys Platform

Jacob Fullerton

unread,
Jun 17, 2016, 4:27:44 PM6/17/16
to Tethys Platform
Hey Alan,

So I think that your idea is going to be the best with adding a button that adds a removeFeature control. I'm trying to do that now, but is there a way to make the button appear inside of the map space? Also, I'm trying to make the button match the symbology of the other buttons inside the map space to keep things uniform. Is there a way I can draw from the existing symbology without having to write up my own css file? I'm not much of a programmer, this is all new stuff to me so I'm just trying to see if there's an easier way of creating a button just like the gizmo buttons without having to create everything from scratch or copying the information from the elements in the browser.

Ideally, when this is all finished, I'd like to make my delete button a gizmo and have it added to the draw options, maybe to be implemented in a future update of tethys (should the idea get accepted). It seems odd to me that we have the draw tools and the move/edit gizmos, but not a delete gizmo.
Message has been deleted

Jacob Fullerton

unread,
Jul 1, 2016, 2:48:44 PM7/1/16
to Tethys Platform
I have decided to put this forward as an idea. We could add another control to the existing map view draw gizmos that deletes features. The code that Shawn Crawley and I worked out that would work fairly well is the following:

     map.on('click', function (e) {
     var pixel = map.getEventPixel(e.originalEvent);
     var feature = map.forEachFeatureAtPixel(pixel,
     function (feature) {
     return feature;
     });
     map.getLayers().item(1).getSource().removeFeature(feature);
     });

I'll work on putting this together in a gizmo, is there someone who could help me with this?


On Thursday, June 16, 2016 at 3:34:19 PM UTC-6, Jacob Fullerton wrote:

swainn

unread,
Jul 1, 2016, 2:54:31 PM7/1/16
to Tethys Platform
Sounds good. Fork the repo, make the changes, and submit a pull request. In the mean time I'll start the vote for adding this feature. Add the code to the tethys_map_view.js file.

+1

Shawn Crawley

unread,
Jul 1, 2016, 4:09:34 PM7/1/16
to swainn, Tethys Platform
+1

--
You received this message because you are subscribed to the Google Groups "Tethys Platform" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tethysplatfor...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/tethysplatform/70c4e3d9-ffb8-4ac0-9be2-20b301837f75%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
Message has been deleted

Jacob Fullerton

unread,
Jul 6, 2016, 4:37:14 PM7/6/16
to Tethys Platform
+1

Jacob Fullerton

unread,
Jul 6, 2016, 5:13:42 PM7/6/16
to Tethys Platform
I'm making the delete gizmo delete only the objects that are created by the MVDraw gizmo at the moment. Any objections? Maybe when we have a layer filter we can remove this restriction and expand the functionality some more. The problem you run into if you don't restrict it to just the "Drawing Layer" object in the Map_View gizmo is that if you have another layer with a different type of object you will get an error in your code if the layer is an image or some other type than the ol.layer.vector object (has to do with how you delete the objects that you click on).

On Wednesday, July 6, 2016 at 2:37:14 PM UTC-6, Jacob Fullerton wrote:
+1
Message has been deleted

swainn

unread,
Jul 6, 2016, 6:02:06 PM7/6/16
to Tethys Platform
I think that delete behavior would be confusing once we implement the "editable" attribute on MVLayers. I would leave it deleting everything (that is editable) and implement the "editable" attribute on MVLayer. Regardless, you should do a check on the type of the object before trying to delete it to avoid the error.

Jacob Fullerton

unread,
Jul 19, 2016, 5:07:25 PM7/19/16
to Tethys Platform
I figured it out, thought I'd put it here on the forum so that people could save time finding this little trick I found. I used the instanceof method which allowed me to check whether the feature that was selected resided on a layer that matched the appropriate type. Just thought I'd share it along with how the delete button functions (neglecting all of the separate lines of code that actually create the physical button, this just handles the actual delete functionality.

  DeleteFeatureInteraction.prototype.handleDownEvent = function(event) {
    var map = event.map;
    var feature = map.forEachFeatureAtPixel(event.pixel,
        function(feature, layer) {
            if (layer instanceof ol.layer.Vector) {
                layer.getSource().removeFeature(feature);
            };
        });
    return;


Reply all
Reply to author
Forward
0 new messages