[OpenLayers-Users] erase drawn features

Mike Quentel mikequentel at yahoo.com
Wed Apr 18 18:50:50 EDT 2007


Christopher, 

Thank you very much for the advice.  The following OpenLayers.Control.EraseFeatures class works well. 

OpenLayers.Control.EraseFeatures = OpenLayers.Class.create();
OpenLayers.Control.EraseFeatures.prototype = 
  OpenLayers.Class.inherit( OpenLayers.Control, {
    /** @type OpenLayers.Control.TYPES */
    type: OpenLayers.Control.TYPE_BUTTON,

    trigger: function () {
      if (this.map) {
        var map = this.map;
        for(i = 0; i < map.layers.length; i++) { 
          var currentLayer = map.layers[i];
          if (currentLayer.isVector) {
            currentLayer.destroyFeatures();
          } //if (currentLayer...
        } // for (i = 0...
      } //if (this.map...
    },

    /** @final @type String */
    CLASS_NAME: "OpenLayers.Control.EraseFeatures"
});

In /theme/default/style.css I added the following:

.olControlEditingToolbar .olControlEraseFeaturesItemInactive { 
  background-image: url("img/erase.png");
}

.olControlEditingToolbar .olControlEraseFeaturesItemActive { 
  background-image: url("img/erase.png");
}

And in EditingToolbar.js I added the following:

new OpenLayers.Control.EraseFeatures(),

In the /lib/OpenLayers.js I added the following:

"OpenLayers/Control/EraseFeatures.js",

Thank you, again, for your advice with this.

Mike Quentel

----- Original Message ----
From: Christopher Schmidt <crschmidt at metacarta.com>
To: Mike Quentel <mikequentel at yahoo.com>
Cc: users at openlayers.org
Sent: Wednesday, 18 April, 2007 3:12:20 PM
Subject: Re: [OpenLayers-Users] erase drawn features

On Wed, Apr 18, 2007 at 01:48:16PM -0700, Mike Quentel wrote:
> So, attaching an erase drawing features function to an onclick event of an icon (outside of the OL API) was simple, but how might I actually turn this into an OL control?  This is supposed to erase all drawn features upon the user clicking a button.  Would I need to implement a class that inherits from OpenLayers.Control?  Here is what I started...

For Controls which perform a single action,
http://openlayers.org/dev/lib/OpenLayers/Control/ZoomToMaxExtent.js is
probably a good starting point. (note the TYPE_BUTTON, rather than
type_toggle).

Panel drawing is controlled via CSS:
http://openlayers.org/dev/examples/panel.html is a good example of some
useful CSS, specifically: 

        .olControlPanel div { 
          display:block;
          width:  24px;
          height: 24px;
          margin: 5px;
          background-color:red;
        }

combined with:

        .olControlPanel .olControlYourNameHereInactive { 
          width:  18px;  
          height: 18px;
          background-image: url("../img/my-control-icon.png");
        }

If you read the CSS and  code there, combined with the ZoomToMaxExtent
control, you should be in good shape.

Regards,
-- 
Christopher Schmidt
MetaCarta





      ___________________________________________________________
Yahoo! Answers - Got a question? Someone out there knows the answer. Try it
now.
http://uk.answers.yahoo.com/ 



More information about the Users mailing list