I'm implementing a map application. It uses Google Maps API for Flash. There is a one callback function that is triggered when the map is clicked. Additionally, there are plenty of polylines that are generated dynamically. The polylines have also click event listener assigned to them. The problem is when I click a polyline, the map click event is triggered at first and then the polyline's click event is fired.
I can't resolve that issue. It's really anoying. Here is code that assigns callback to the map's click event:
map = new Map();
map.key = GOOGLE_MAP_KEY;
map.addEventListener(MapMouseEvent.CLICK, onMapClicked, true);
and here is code that assigns callback function to a polyline's click event:
var polyline:Polyline = new Polyline(path);
polyline.addEventListener(MapMouseEvent.CLICK, cutToEnd);
I need to supress the "onMapClicked" function's invocation when I click on a polyline. Only "cutToEnd" method should be invoked.
Thanks
map.addEventListener(MapMouseEvent.CLICK, onMapClicked, true);
You use bubblingPhase here (third "true" parameter). It means, that when you click polyline, event "reaches" first your map, because it's capturing from stage to your button. Set parameter "false", or leave only 2 parameters (useCapture is "false" by default). Then in the end of your polyline click handler add event.stopPropagation() method call. It will make event stop bubbling to stage, and it won't "reach" your map.
UDATE: If MapMouseEvent does not bubble you can compare event.target and event.currentTarget properties. In your polyline click listener they will be equal. So you may add
if(event.target != event.currentTarget)
return;
at the beginning of your map click listener.
Related
I am creating one App in appmaker in which I want to have some code on onHover() event (On Label), I can only see 4 events available
onAttach
onDetach
onDataLoad
onClick
How can I call my methods on onHover event?
App Maker doesn't provide onHover event handler out of the box, however you can add event listener for mouseenter or mouseover event on your own:
// client script
function doMagic(event) {
// do the magic here
}
// onAttach widget's event
widget.getElement().addEventListener('mouseenter', doMagic);
// onDetach widget's event
widget.getElement().removeEventListener('mouseenter', doMagic);
I'm trying to keep my Ckeditor 4 toolbar buttons to a minimum, but want figure out what buttons the users are using most.As such, I'm trying to add google analytics to toolbar button clicks.
Firing off a JS event to record the analytic is no problem. However, I'm having a hard time figuring out how to capture the click event of the toolbar item specifically. Is there an event callback I can bind to? Thanks.
Ideally, this does not have to use the jquery ckeditor connector as I have managed to not use that yet. Although, it is ok to use Jquery itself.
I think I figured it out. There appears to not be a way to do this at the CKEDITOR class level, however it can be done at the individual editor level.
Inside of my instanceReady handler, I can add afterCommandExec event handler.
CKEDITOR.on('instanceReady', function (e) {
var textarea_id, editor;
textarea_id = e.editor.name;
editor = CKEDITOR.instances[textarea_id];
// Attach handler for events
editor.on('afterCommandExec', function (evt) {
// Record Analytic of toolbar bar & keypress events
// See http://docs.ckeditor.com/#!/api/CKEDITOR.command-property-state for vals
var cmd_name, cmd_prev_state, cmd_new_state;
cmd_name = evt.data.name;
cmd_prev_state = evt.data.command.state;
cmd_new_state = evt.data.command.previousState;
console.log([cmd_name, cmd_prev_state, cmd_new_state]);
// Call analytics event next ...
});
})
References:
Event callbacks for the global CKEDITOR level: http://docs.ckeditor.com/#!/api/CKEDITOR-event-instanceReady
Event callbacks for the editor instance level: http://docs.ckeditor.com/#!/api/CKEDITOR.editor-event-afterCommandExec
I'd like to avoid that mouse events triggered by the user don't get dispatched to their target objects, effectively "freezing" the GUI for the user.
In a sample application featuring just a single mx.controls.Button I called addEventListener on the button to get notified of mouse events. In the event handler, I called Event::stopImmediatePropagation on the event, assuming that this would "discard" the event. Clicking the button would call my event handler, but yet the button was "clicked" (it animated and triggered an event).
How could I do this?
button.mouseEnabled = false;
button.mouseChildren = false;
should work
Depending on how advanced your interface is, you could just throw an object (s:Rect in an s:Group would work) on top of everything, set width and height to 100%, and disable mouseChildren
USE removeEventListener()
var b:Button = new Button();
function init():void
{
b.addEventListener(MouseEvent.CLICK, onButtonClick);
}
function onButtonClick(event:MourseEvent):void
{
b.removeEventListener(MouseEvent.CLICK, onButtonClick);
}
How to get event name in GMap V3.
Tried as,
function initialize(){
-------------------
google.maps.event.addListener(map, 'click',function(){handleViewUpdate();});
google.maps.event.addListener(map, "dragend", function () {handleViewUpdate();});
-------------------
}
function handleViewUpdate(){
alert(map.getEvent()+' Event');
}
but fails. :(
Any help please :)
why don't you use some flag variable send it as a parameter to the function
for eg:
handleViewUpdate(1) for first thing
handleViewUpdate(2) for other.
then you can get the event name.
There is no map method named getEvent, but some of the event listener callbacks do pass arguments (but not all). For example, you could change your click event listener definition to:
google.maps.event.addListener(map, 'click', function( event ) {
//do something with the event parameter here
handleViewUpdate();
});
In contrast, the dragend event does not pass anything to the event listener. The google.maps.Mapapi-doc has full details if you scroll down to the Events table.
All that said, the google.maps.MouseEventapi-doc doesn't include a "name" or "type" property that could be used to address your specific question. I've inspected the incoming event in Chrome's console and there is nothing that you can use to perform a switch action. When you define the event listener, the callback function is about the only thing that you can use to give you the context of the event that was fired. So the suggestion in #NejiHyuga's answer is pretty much your best option.
I understand how to get my current location with HTML5.
How do I add a click handler, so when a button is pressed it shows my current position on the map?
Google's example pretty much explains how it's done, but the button is set to predefined coordinates. How do I attach the "Home" button to current position coordinates instead?
Custom Control Example
From Google demo
navigator.geolocation.getCurrentPosition(function(position) {
initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
map.setCenter(initialLocation);
As initialLocation is global you can use this to set the click event listeners: simply set the map to initialLocation
google.maps.event.addDomListener(controlUI, 'click', function() {
map.setCenter(initialLocation)
});