Using the BirdEyeZoom tool is cool, however I hate having to click buttons so I modified the BirdEyeZoom component this morning to add functionality for zooming on an external mousewheel event. I also noticed that when the scale of the graph is at the minimum or maximum, any further reduction or increase in scale causes the graph to fall off the bottom of the component. I have added a couple checks to handle this case as well.
To add this functionality, I modified the updateVScale() method in the org.un.cava.birdeye.ravis.components.ui.controls.vgraph.controls.birdEyeZoom component to read:
/* update the scale of the VGraph, thus creating a BirdEye zoom effect */
public function updateVScale(event:MouseEvent=null):void {
if(bzoom == null) {
return;
}
if(_vgraph == null) {
LogUtil.warn(_LOG, "BirdEyeZoom NOT changed, no valid vgraph!");
return;
}
// Handle the update for mousewheel events outside the component
if(event != null)
{
if(event.delta != 0)
{
// this handles the case where the user tries to zoom out beyond the minimum value
if(bzoom.value == bzoom.minimum)
{
if(event.delta > 0)
{
bzoom.value = bzoom.value+(event.delta*0.01);
_vgraph.scale = bzoom.value;
}
}
// this handles the case where the user tries to zoom in beyond the maximum value
else if(bzoom.value == bzoom.maximum)
{
if(event.delta < 0)
{
bzoom.value = bzoom.value+(event.delta*0.01);
_vgraph.scale = bzoom.value;
}
}
else
{
bzoom.value = bzoom.value+(event.delta*0.01);
_vgraph.scale = bzoom.value;
}
}
}
// Handle the update for the zoom buttons
else
{
// this handles the case where the user tries to zoom out beyond the minimum value
if(bzoom.value <= bzoom.minimum)
{
bzoom.value = bzoom.minimum;
return;
}
else
{
_vgraph.scale = bzoom.value;
}
// this handles the case where the user tries to zoom in beyond the maximum value
if(bzoom.value >= bzoom.maximum)
{
bzoom.value = bzoom.maximum;
return;
}
else
{
_vgraph.scale = bzoom.value;
}
}
}
To implement, just add an event listener to listen for the MouseEvent.MOUSE_WHEEL where your component is used and then in the event handler, pass the event to the component. In my example, I did something like this:
// This is called on my initialize event or whenever you want
// (creationComplete/applicationComplete work well too)
private function initApp():void
{
this.addEventListener(MouseEvent.MOUSE_WHEEL, wheelhandler);
}
private function wheelhandler(event:MouseEvent):void
{
beZoom.updateVScale(event);
}
...
<ns2:BirdEyeZoom id="beZoom" left="10" vgraph="{vGraph}">
</ns2:BirdEyeZoom>
Hope this helps.