GeoExt.action to Ext.Button or Ext.Menu item
If you won to create toggle OpenLayers control with ext button, I recommend you to use GeoExt js lib. it allows you to toggle OpenLayers control with ext button and much more,
see the examples(http://geoext.org/examples.html). For this example I used GeoExt 1.1, OpenLayers 2.9 and Ext 3.2. :]
Here is a example where GeoExt.Action control is put in Ext.Button:
var actions = {};
actions.m_line = new GeoExt.Action({
text: 'mesure line',
control : new OpenLayers.Control.Measure(
OpenLayers.Handler.Path,
{persist: true}
),
map: OLmap,
group: "measure"
});
actions.m_poly = new GeoExt.Action({
text: 'mesure Polygon',
control : new OpenLayers.Control.Measure(
OpenLayers.Handler.Polygon,
{persist: true}
),
map: OLmap,
group: "measure"
});
new Ext.Button({
split: false,
enableToggle: true,
iconCls: 'mesure',
allowDepress: false,
pressed: false,
tooltip: App.i18n('app.map.tbar.measure'),
toggleGroup: "toolGroup" + this.id,
menu: {
items: [
new Ext.menu.CheckItem(actions.m_line),
new Ext.menu.CheckItem(actions.m_poly)
]
},
listeners: {
toggle: function (btn, pressed) {
if (!pressed) {
var key;
for (key in actions) {
if (key) {
var control = actions[key].control;
if (control.active) {
control.deactivate();
}
}
}
}
},
scope: this
}
});
see the examples(http://geoext.org/examples.html). For this example I used GeoExt 1.1, OpenLayers 2.9 and Ext 3.2. :]
Here is a example where GeoExt.Action control is put in Ext.Button:
var exampleBtn = new Ext.Button(You can also create button with menu:
new GeoExt.Action({
control: new OpenLayers.Control.DrawFeature(
vectorLayer,
OpenLayers.Handler.Polygon
),
map: OLmap,
text:'Draw Polygon'
allowDepress: true,
enableToggle : true,
toggleGroup: "toolGroup-draw",
})
);
var actions = {};
actions.m_line = new GeoExt.Action({
text: 'mesure line',
control : new OpenLayers.Control.Measure(
OpenLayers.Handler.Path,
{persist: true}
),
map: OLmap,
group: "measure"
});
actions.m_poly = new GeoExt.Action({
text: 'mesure Polygon',
control : new OpenLayers.Control.Measure(
OpenLayers.Handler.Polygon,
{persist: true}
),
map: OLmap,
group: "measure"
});
new Ext.Button({
split: false,
enableToggle: true,
iconCls: 'mesure',
allowDepress: false,
pressed: false,
tooltip: App.i18n('app.map.tbar.measure'),
toggleGroup: "toolGroup" + this.id,
menu: {
items: [
new Ext.menu.CheckItem(actions.m_line),
new Ext.menu.CheckItem(actions.m_poly)
]
},
listeners: {
toggle: function (btn, pressed) {
if (!pressed) {
var key;
for (key in actions) {
if (key) {
var control = actions[key].control;
if (control.active) {
control.deactivate();
}
}
}
}
},
scope: this
}
});
Thanks!
ReplyDeleteI am trying to create a FeatureInfo Tool on my application but nothing happens. I have tried placing breakpoints on my Firebug but still there is no output.
ReplyDeleteThis is the link, http://128.196.142.12/geo/test/test_new.html
As you can see, I have created another tool BioClim Data (top - right corner), which works fine but the Feature Info tool does not return the desired output.
Any clue where I am going wrong? Here is the code for the tool, http://dpaste.de/iOwSD/. I have tried to replicate the code in the recipe, http://128.196.142.12:8080/recipes/#basic/info