Google Maps - "b is undefined" when simulating polygon clicks? - javascript

We have a campus map which has been created by a number of our students. For the most part, it runs fine, but there is one persistent error which we are unable to clear. There is a sidebar which lists out the buildings and points of interests which are represented on the map which, when clicked, [simulate a click][1] on the polygon for the building/poi.
function sideClick(poly) {
google.maps.event.trigger(buildingpoi[poly],'click');
};
Where buildingpoi[i] is an array which holds the information regarding each polygon.
Whenever a click is triggered, it refers to a method called shapeClick() which handles the display of information and repositioning of the map to center on the building/poi. Regardless of whether it is the polygon itself or the link in the sidebar, this method executes completely without error.
However, when the sideClick() function is used, or when the click trigger is called in the code, an error occurs in the Google API files, namely a main.js file:
TypeError: b is undefined
...(a.Va)||b.set("poly",null)})]};function VH(a){var b=a.Se;b.b||(Q(Xe,function(c){...
This error appears to occur after the successful execution of the shapeClick() method, suggesting that the error lies- as noted in the error message- in the GMaps API main.js file at some point after shapeClick() is called. Generally, this does not cause an issue on the front end, but when I attempted to include another method which calls sideClick(), any code I place after sideClick() is not executed due to the error.
I've attempted a number of my own tests/fixes, but the best I've been able to do is narrow down where the error is triggered. My searches also appear to come up with related yet dissimilar results. I assume the answer may be very simple, but for me it has been elusive.
Map: https://www.beloit.edu/maps/

Although you did not access the event-argument in shapeClick(what will not be supplied when you trigger the event), it seems that the API internally tries to access this argument.
The API tries to read the vertex-property(don't ask me why) of the PolyMouseEvent(that's what event is expected to be).
Accessing a property of an undefined object results in an error, that's what the message says.
Provide an empty object as argument when you trigger the event:
google.maps.event.trigger(buildingpoi[poly], 'click',{});
...and the error will go away(accessing an undefined property of an existing object is not an error)

Is buildingpoi[i] as you said an array holding information for the polygons? or a reference to the polygon itself?
This function needs the reference to the actual polygon, which is fine if it's in an array.

Related

can't access array of objects in object

I'm baffled about why I'm getting an error when trying to access an array inside of an object in ReactJS.
I am using Redux to store an object in State.
I have a success function that allows the page to render, so by the time I get to this object it has for sure loaded. (I noticed a ton of similar questions to this where that's usually the problem).
When I do this I get the proper results:
const { events } = this.props
console.log(JSON.stringify(events.listSignup))
{"data":[{"eventID":"264712106049274377","name":"BookOne","email":null,"verify":null,"privacy":null,"order":null,"group":null},{"eventID":"264712106049274377","name":"BookTwo","email":null,"verify":null,"privacy":null,"order":null,"group":null}]}
I can see that the array "data" exists, but when I try:
console.log(JSON.stringify(events.listSignup.data[0].name))
or
console.log(JSON.stringify(events.listSignup.data[0]))
I get "TypeError: Cannot read property 'data' of undefined"
I'm at my wits end trying to figure out what's going on. Any advice would be much appreciated!
You're right to be baffled, because what you [think you] have observed isn't possible.
This happens a lot to me as a developer, and my advice is that when this happens, trust your knowledge (you know this isn't possible!) and double check what you are seeing.
I suspect that the first time your component renders, this.props.events is undefined, but then it very quickly re-renders with this.props.events being set.
I would suggest adding back this line (without the others):
console.log(JSON.stringify(events.listSignup))
And scrolling up in your javascript console to see if you have any logs that are just displaying undefined. If so, you probably need to double check the logic which is preventing the page from rendering before you have successfully received the data, as I suspect that is where your problem is.

Erratic behavior of Javascript - Cannot read property 'longitude' of undefined

I'm working on an Angular App, which loads data from an API.
Everything is working as expected, except periodic receiving this bug in Chrome console.log
TypeError: Cannot read property 'longitude' of undefined
This causes some of the subsequent functions to disfunction aswell. The line angular complains at, is the following
function updateMapWaypoint(lastposition) {
console.log("updateMapWaypoint(%s) called", lastposition);
console.log($scope.units[$scope.selectedUnitIndex]);
var longitude = (lastposition) ? $scope.units[$scope.selectedUnitIndex].lastposition.gps.longitude : $scope.unsortedPositions[$scope.selectedPositionIndex].gps.longitude;
Where to two first is debugging and the last one, the line causing trouble. As far as I can see from the printet object in the console. Javascript should have no trouble locating longitude from the object, however it throws the error and I can't find any way to solve it.
All help is appreciated and if more details is required, I'll provide if possible for me.
This looks like it might be a race condition.
console.log() will show you the object as it is right now, and not what is was when you called console.log(). To see the properties of an object at a certian point in time you must copy its content and send them to console.log(), for example by stringifying it:
console.log(JSON.stringify(myObject))
Or if you are using Angular:
console.log(angular.extend({}, myObject));
This is confusing (it has messed with me several times). Remember that you are sending console.log() an object reference, not a copy of the object.

Can access an object via console during debugging, but code throws an error

This problem is honestly the strangest thing I have encountered. I have no idea whether or not it's able to be reproduced, so I'm just asking for some input on possible causes.
The code is accessing a property (transit) on an object inside a lodash 'each' loop. The object is called step.
The code throws an exception when it tries to access a property on transit, on step (step.transit.propName). It says 'transit' is undefined.
But when you type 'step.transit' into the console, somehow the debugging tools are able to access it!
The code, and the V8 inspector tools, somehow aren't looking at the same thing. What on earth is happening here?
You'll have to look at the screenshot there to really grasp what's going on. Notice how the watch expressions show step['transit'] being both available, and unavailable at the same time....
It's strange, when I stop the code at that line, and type 'step.transit' into the console, I get the appropriate object. But there's some crazy thing in the code, where it can't seem to execute it.
This is an AngularJS app. Is there any way I could have screwed this data up in order to cause this weird error?

Why are some Facebook Graph API Event fields undefined?

I'm working with Facebook Events via the Graph. The documentation is here:
https://developers.facebook.com/docs/reference/api/event/
I can access some of the fields such as id, name, start_time, and location without any trouble at all. But some of the fields are always undefined. Specifically, description is always undefined. However, the fields aren't undefined when I look at them via the Graph API Explorer.
This isn't just an isolated instance; it's happening all over my application. So I'm fairly certain that the error isn't typographical. The fields that are defined and undefined are always the same. For example, something as simple as the following returns accurate information across multiple events for each of the fields except description.
alert(facebookEventsArray[i].id);
alert(facebookEventsArray[i].name);
alert(facebookEventsArray[i].description);
Does anyone have any idea what the problem might be?
By default, you wont get the description of an event. You can explicitly mention the fields you require in your call. For eg:
EVENT_ID/events?fields=name,start_time,timezone,location,description

Google Analytics Events - when are they send?

My "application" is a single web page (myPage.html) displaying items on a Google Map. So it is not a scenario where the user navigates among several pages.
Therefor I am using events to track the interactions. However, I find it strange to believe what I see in the statistics.
I have checked the events for syntax and it seems to be OK.
_gaq.push(['_trackEvent', 'MyApp', 'ChangeTav', newTab]);
_gaq.push(['_trackEvent', 'MyApp', 'Load', 'itemType', loadTime]);
....
What I wonder about, I do add Arrays to to _gaq object, but when are these actually send? What happens if the user closes the browser? And is there a way for me to "force" sending these values?
The other way around, user stays on the page for some time, values get added to _gaq, but how I do make sure they not getting lost?
-- Update --
With the push I simply add an Array to an Array, or is this wrong? So in this particular moment nothing happens, I did not see any callbacks or overridden methods. Please correct if I am missing something.
-- Update 2 --
http://code.google.com/apis/analytics/docs/tracking/asyncUsageGuide.html
It seems to be different whether I use sync or async. For async (I am using) ...
To push an API call onto the queue, you must convert it from the traditional JavaScript syntax into a command array. Command arrays are simply JavaScript arrays that conform to a certain format. The first element in a command array is the name of the tracker object method you want to call. It must be a string. The rest of the elements are the arguments you want to pass to the tracker object method. These can be any JavaScript value.
When I do init with var _gaq = _gaq || []; it becomes an array. However, I do never see values being removed from the queue (_gaq), so I'd assume they are never send.
--- OK, here we go ---
http://code.google.com/apis/analytics/docs/gaJS/gaJSApi_gaq.html#_gaq.push
This function is named push so that an array can be used in the place of _gaq before Analytics has completely loaded. While Analytics is loading, commands will be pushed/queued onto the array. When Analytics finishes loading, it replaces the array with the _gaq object and executes all the queued commands. Subsequent calls to _gaq.push resolve to this function, which executes commands as they are pushed.
I believe, it's send as soon as you call it. Provided that the _gaq has been initialized. Depends on where you put the GA init code.
The .push method you are referring to is only for arrays. With Objects, you can define it yourself, you are not overriding anything.
Arrays in js can't have custom indexes / labels, if they do, they are objects.
If you run
var a= {"a":"b"};
var b = ['a','b'];
b.push("c");
a.push("c","d");
You will get an error , function a.push is not defined.
a is an object, b is an array. The push function only exists in the prototype of Array.
To observe when exactly the stuff is tracked, you can use the Net panel in Firebug and check for a _utm.gif file being requested.

Categories