Load map:
map = new Microsoft.Maps.Map(document.getElementById('myMap'), {
...
});
And it works fine (visually). But:
console.log(map instanceof Microsoft.Maps.Map); // false
Whaaat?! :) How can I check it? Is it a bug or my mistake?
You can try example in Bing Dev Center sandbox:
http://www.bing.com/api/maps/sdkrelease/mapcontrol/isdk#loadMapAsync+JS
Thanks
Using the Bing Apps dev page, if you edit out the new it still works, and logging map.constructor just prints function n(). So it appears Microsoft has not been entirely accurate as to what the code does at the moment - which is to act as an object factory.
Microsoft may be reserving the right to make Maps.Map an object constructor in the future. At the moment instanceof returning false is correct.
Related
I am trying to redefine method toString of Error.prototype object, I can't do it in Google Chrome Canary, but I can do it in Firefox.
You can try to do it by your own, here is the code:
Error.prototype.toString = () => 'booooka'
throw new Error('Message, that have never been shown') // "booooka" in Firefox, "Message" in Google Chrome
What is a problem doing this in Google Chrome?
How I can do this in Google Chrome?
Firefox: 57.0.4
Chrome: 66.0.3356.0 (Official Build) canary (64-bit)
P.S. I have tried to paste this code to jsbin/jsfiddle, but I have the same result as in the Chrome. I am confused, maybe you can help me with that.
Thank you.
Adding to the previous answer, if you do :
throw new Error('Message, that have never been shown').toString();
'bookah' will be shown, so the issue is related with the implementation of the Error class rather than with overriding prototype properties
Chrome lets you override toString just fine, but its console shows you the error’s stack instead of its toString(). Since the stack property is defined as an own property instead of being assigned to, there’s no neat way to override it (and possibly no way to override it period).
Consider this type of constructor:
const defineProperty = Object.defineProperty;
const Error = function () {
defineProperty(this, 'stack', {
configurable: true,
writable: true,
value: '…',
});
};
I’m not aware of any way at all to change the value of new Error().stack in this context compared to what the constructor set.
That’s probably a good thing, though. What’s your goal?
I'm trying to figure out the example of geocoding and I have the following code in my event handler for a click on a button.
locate() {
const coder = google.maps.Geocoder();
coder.geocode(
{ address: "stockholm" },
(result, status) => { ... });
}
It works as supposed to but the name google gets highlighted by VS Code with the warning that the name can't be found. I'm not sure where the object comes from and I don't know how to declare it so that it isn't flagged as unknown/undeclared.
When I run the google thingy in the console of Chrome, it actually does work producing some kind of object with maps in it. However, the same operation in the console of FireFox doesn't produce anything useful.
What's that googly-mappy object and how do I learn Angular that it's there?
You tell angular that a foreign JavaScript global object or lib is there by declaring it, as shown in previous answer:
declare const google: any;
You could also teach your typescript all the correct types so that VSCode will even help you:
npm install #types/googlemaps --save
Under your imports you can tell the typescript compiler that there will be a global variable google at run time.
// component.ts
declare const google;
Anyone know what's up with mapbox.js's infoControl, and how can I implement it with position option and .addInfo() method without failing tests?
I'm having trouble with the infoControl in Mapbox 1.6.1 -- it's failing rake tests with 'undefined is not an object' or 'not a function'. Undocumented options like position still work with it. I'm using the other controls (eg zoom, layers) without the same problems.
My code:
class MyMap extends Backbone.View
initialize: (#options) ->
#map = L.mapbox.map(mapContainer, #options.mapboxMap,
zoomControl: false,
infoControl: false)
#addControls()
addControls: (map) ->
L.mapbox.infoControl({ position: 'bottomleft' }).addInfo('Contains information from YZ.').addTo(#map)
L.control.scale().addTo(#map)
L.control.zoom(position: 'bottomleft').addTo(#map)
Throughout this, the info box still works fine on my map, there's no problem with it besides it failing these rake tests.
Looks like you're calling #addControls(), when you should be calling #addControls(#map) - .addTo(undefined) is being called, which is invalid.
I'm writing a JavaScript application using the Google Maps Javascript API v3 and RequireJS. I wrote a little wrapper for gmaps in order to get the dependencies right:
define('gmaps', ['goog!maps,3.9,packages:[geometry],language:de,other_params:sensor=false&channel=...&client=...'],
function(){
return window.google.maps;
});
This works perfectly fine in most of the cases, even after minifying the code using the optimizer. However, sometimes I get an error saying gmaps.geometry is undefined in a module that has gmaps as a dependency and tries to calculate a distance:
define(['gmaps'], function(gmaps) {
return {
...
calcDistance: function(target) {
var position = this.getPosition();
var distance = gmaps.geometry.spherical.computeDistanceBetween(
new gmaps.LatLng(position.latitude, position.longitude),
new gmaps.LatLng(target.latitude, target.longitude)
);
return (distance / 1000).toFixed(2);
}
}
});
This only happens if I try to execute calcDistance right after the page and the required data has loaded and only sometimes. I guess this is some problem with the async loading of gmaps, but I don't fully understand it. How can gmaps be defined but gmaps.geometry be undefined? Is there any way to fix this?
It seems you are not loading the correct library. Just append &libraries=geometry in the library url.
Check this
google.maps.geometry.spherical error
packages:[geometry] doesn't seem to work like I thought it would, so geometry wasn't loaded at all. Google seems to internally load geometry at some point, so my code for distance calculation worked in most cases. I fixed the problem by changing the define call of my gmaps module to:
define('gmaps', ['goog!maps,3.9,language:de,other_params:libraries=geometry&sensor=false&channel=...&client=...'],
function(){
return window.google.maps;
});
I know this is an old question, but in my situation I see that geometry libraries is not available at the initialization. I don't know why. But it became defined after some time. So I resolve the problem using a wait function.
setTimeout(waitForGeometryLibraries, 250);
function waitForGeometryLibraries(){
if(typeof google.maps.geometry !== "undefined"){
// code using geometry library
}
else{
setTimeout(waitForGeometryLibraries, 250);
}
}
I'm creating a dynamic map with the Google Maps API and I'm getting hard to understand errors from only certain markers. My page is located at:
http://dmatesic.com/RaC/Customized%20Google%20Map/google_map.html
My (long) java script source file is located at:
http://dmatesic.com/RaC/Customized%20Google%20Map/js/google_map.js
Everything is working fine except for one marker. If you click on "SERVICOS" and then select the sub category "Repuestos de Autos" I am getting odd errors from the google map main.js file.
In Firefox I get:
c is undefined
http://maps.gstatic.com/intl/en_us/mapfiles/193c/maps2.api/main.js
Line 600
In IE:
'x' is null or not an object main.js, line 600 character 83
I have no idea why everything is working except for this one sub category/marker. If there any other details I can provide to help us solve this problem, please let me know.
Any ideas?
Thanks!
you are getting error because getZoomFactor return NaN, and after that you are calling setCenter method with zoom NaN.
This is the line that is causing problem.
zoom = getZoomFactor(minLatitude, maxLatitude, minLongitude, maxLongitude, centerLatitude, centerLongitude, 600);
map.setCenter(centerPoint, zoom);