Adding a listener to mousemove and inspecting the event with console.log yields an object:
{qE {latLng: Q, Sa: MouseEvent, pixel: undefined, ca: undefined, ...}}
I'm looking to extract the pageX and pageY attributes of the {Sa: MouseEvent} object.
I know I can access them with event.Sa.pageX and event.Sa.pageY. But, as far as I know, the Sa object isn't documented anywhere. Is there another, more robust way to access pageX and pageY? I'm just worried about it breaking in the future.
pageX and pageY are properties of the DOM-event, it appears the event you observe is a google.maps.MouseEvent, which does not expose the requested properties.
Use addDomListener instead to observe the DOM-event(of the node that contains the map):
google.maps.event.addDomListener(map.getDiv(), 'mouseover', function(e){
console.log(e.pageX+','+e.pageY);
});
Related
When using Google Places API, what is the best way of hiding the map itself ?
We only need the search auto-complete, and our users don't need to see the map itself.
https://developers.google.com/maps/documentation/javascript/places?authuser=2#place_search_requests
Got the answer from https://developers.google.com/maps/documentation/javascript/places-autocomplete?authuser=2#video
Basically the Autocomplete constructor has a constructor overload
= new google.maps.places.Autocomplete( htmlInput, autoCompleteOptions )
var autocomplete = new google.maps.places.Autocomplete(input, { bounds: defaultBounds });
And this is not violating the TOS at all, reading the https://developers.google.com/maps/documentation/javascript/places-autocomplete?authuser=2#video above.
When I use google.maps.event.trigger on a google.maps.Data.Layer that is listening for click events, the latLng object is getting passed to my listener instead of the actual click on the feature:
//feat is generic google.maps.Data object
feat.addListener('click', function (e) {
console.log(e);
});
// the event is the latLng object
// place is the same location as when I manually click on the map
google.maps.event.trigger(feat, 'click', {
latLng: place.geometry.location
});
>>> Object {latLng: L}
// when I actually click at the same position, the event is different
>>> NW {latLng: L, Gb: MouseEvent, pixel: undefined, Ja: undefined, feature: Ec}
How can I manually trigger a click event that has the same form as actually clicking on the map?
The problem is this: The callback function on the click event on the Data class has a Data.MouseEvent available to it:
https://developers.google.com/maps/documentation/javascript/reference#Data.MouseEvent
i.e. in this code, e is a Data.MouseEvent:
feat.addListener('click', function (e) {
console.log(e);
});
So when you output e to the console, that's what you're seeing when you get:
NW {latLng: L, Gb: MouseEvent, pixel: undefined, Ja: undefined, feature: Ec}
But the only value you're passing to the event when you trigger it is a LatLng object. If you want to make it the same, you'd need to construct a Data.MouseEvent instead.
Something like this I think:
var event = new google.maps.Data.MouseEvent({
latLng: place.geometry.location
});
google.maps.event.trigger(feat, 'click', event);
You'd maybe also need to specify the feature property for that Data.MouseEvent; I'm not sure if you'd just be able to use the Data object you've already got:
var event = new google.maps.Data.MouseEvent({
latLng: place.geometry.location,
feature: feat
});
I have two selects where the seconds values depends on the choosen value in the first one (Countrys / States) both are collections
When i subscribe with for example Belgian as country i get the states for Belgian
But when i choose another country (ex. Netherlands) the states are added !
I read that i must stop de subscription with .stop() an renew the subscription but this doesnt deems to work ???
My code :
'click #stateList' : function(event, template) {
var x = myTrim($("#countryList").val());
var y = Countrys.findOne({country: x});
var z = y.nr;
if(this.stateSub != null){
this.stateSub.stop();
}
this.stateSub = Meteor.subscribe('stateList', z);
}
It seems that this.stateSub is always undefined even if there is already a working subscribe ???
What am i doing wrong ???
thanks
In template events, this binds to the context document (in impressive ways sometimes) so you can get this._id for the document in the "HTML scope" where the event took place.
If you want to persist an object throughout events, you can use the template object that the event receives as an argument instead. This object will persist across events, as long as you're on the same template, that is.
Experimenting with meteor I came across a behavior I did not expect of fetch. Let's say I have a function :
findStuff = function(){
var cursor = Stuff.find({});
console.log(stuff.fetch()); // just to check
return cursor;
}
and I call it from a template
Template.stuff.helpers({
stuff : function(){
var stuff = findStuff();
console.log(stuff.fetch()); // just to check
return stuff;
}
});
The first log will correctly display the array but the second will display an empty array. I am quite confused about why it is so. My solution is to avoid calling fetch if I don't need it explicitly but I like to use it as a debugging tool.
You should read about cursor.rewind().
The forEach, map, or fetch methods can only be called once on a
cursor. To access the data in a cursor more than once, use rewind to
reset the cursor.
This is the basic idea of my code. I removed a lot of extra stuff from my actual code, but it was mostly css - none of it should have any affect on this...
listRef.on('child_removed', function(childSnapshot, prevChildName) {
alert('child removed!');
});
listRef.on('child_added', function(childSnapshot, prevChildName) {
itemRef = childSnapshot.ref();
alert('child added!);
itemRef.on('value', function(snapshot){
alert('item value changed!');
var name = snapshot.val().name; // if I remove this line, child_removed is called
$("#name").html(name);
});
});
$("#button").click(function() {
itemRef.remove();
});
The problem is that on $("#button") click, itemRef is removed from listRef in Firebase, but the 'child_removed' event is never triggered... If I take out
driveRef = undefined;
then child_removed is called...
Everything else works - $("#name") is updated and all of the alert() dialogs I am using to test it are working fine - the only problem is child_removed not being called.
I think Kato's comment is right on. If you look in your browser dev tools javascript console, or better yet set it to break on all exceptions (e.g. directions for Chrome), I bet you'll find your 'value' callback is being called with snapshot.val() == null when the child is removed, and so your code throws an exception which is preventing Firebase from raising further events (i.e. your child_removed event).
We have some feature work planned to make Firebase a little more tolerant of event callbacks throwing exceptions, but for now the fix is to check for snapshot.val() == null in your 'value' callback.