I'm getting Invalid argument error when loading google maps in IE - google-maps

Message: Invalid argument.
Line: 26
Char: 56
Code: 0
URI: http://maps.gstatic.com/intl/en_us/mapfiles/api-3/9/13/main.js
I went through the solutions in Stack Exchange found some thing relevant at
Google Map api v3 - IE7 - main.js error - invalid argument (javascript)
and tried to remove the div for test purpose through jQuery like below
$(".gmnoprint").children().remove();
$(".gmnoprint").empty();
$('.gmnoprint').find("div").slice(1,2).hide().remove();
$('.gmnoprint').find("div").hide().remove();
$(".gmnoprint").children("div:lt(1)").remove();
$('.gmnoprint div:nth-child(1)').remove();
$(".gmnoprint").first().remove();
but no options has worked.

I also had this problem for IE7/8 (didn't try IE6, IE9 worked well), same line and column and same maps api file version.
I figured out that this happened (at least for me) whenever map should be re-rendered on the same page (async approach), and solution was to always remove map node from DOM just before trying to re-render map again, with e.g:
$('#MAP_CONTAINER_ID_HERE').children().remove();
with jQuery (or equivalent with native js),
Also, sometimes the problem may be in an unfinished job from the previous map rendering (assuming that we're discussing issue with maps that are re-rendered on the same page), and IEs<9 seem to be fragile when redrawing over unfinished maps.
That said - maybe you could check another thread (http://stackoverflow.com/questions/8175425/invalid-argument-error-in-ie7-jquery-tabs-and-google-map) dealing with what I just described if removal of nodes representing previous map rendering didn't help.
Finally - if you're experiencing this bug with no map re-rendering then you're probably running into issues with improperly created options or something similar, it would be much easier to respond if some code snippet or at least scenario is given.

Related

DataVizExtention: issue with clearing viewables while a sprite is selected

In my code, I have this workflow:
When user wants to see some things, add Sprites using 'DataVizCore.addViewables()'
Use 'viewer.addEventListener(DataVizCore.MOUSE_CLICK, onDotClick)' to show info bubble
When user wants to show other things, call 'DataVizCore.removeAllViewables()' to clear Sprites
Repeat from step 1
This sequence works OK except in one situation.
If a sprite was selected (by clicking on it) before removeAllViewables() is called, I don't get MOUSE_CLICK event for newly added Sprites. In browser console, I see following error is thrown.
CustomViewables.js:318 Uncaught TypeError: Cannot read property 'style' of undefined at ViewableData.getViewableUV (developer.api.autodesk.com/modelderivative/v2/viewers/7.*/extensions/DataVisualization/DataVisualization.js:454)
As a workaround, I added 'event.hasStopped = true' to click event handler to prevent Sprite getting selected internally. That seems to work.
This seems like a bug in DataVizExtension to me. Or, my workflow is wrong?
Thanks
Bandu
Bandu. Thanks for the detailed steps to reproduce this issue. I tried with v7.46.0 version of the DataVisualization.js (latest as of my message) but was not seeing the same issue. I'd be curious if you are using this same version of the Forge Viewer (you can figure that out by looking at the viewer3D.js fetched under the Network tab of Chrome DevTools).
Setting event.hasStopped = true works because it internally avoided the code path calls into getViewableUV that threw the exception, but the flag is meant for other use cases (e.g. overriding default sprite selection behavior).
In any case, I've just tweaked our internal code to make use-cases like yours more robust. The changes will be released with the upcoming v7.47.0. Thank you for your feedback 🙂

Property '_popup' does not exist on type 'Marker<any>'

So, I am building a map using angular and leaflet. One of the things that I use is leaflet.markercluster. When i click on the cluster I want the popup content of a random marker of a cluster to be written somewhere. To access the popup content of some random cluster I did this:
cluster.getAllChildMarkers()[0]._popup._content
and got an error: Property '_popup' does not exist on type 'Marker'.
But the thing is, if I do ng serve first time it failes to compile, but if I change anything and save all it compiles sucessfully with the errors and I can see the content of the popup.
Also, if I do console.log(cluster.getAllChildMarkers()[0]) and I inspect element on webpage I get the regular console log of a marker with latlng andall other atributtes, including _popup.
Does anybody know why does typescript/vscode log an error, but html console sees it normally?
Because TypeScript is more strict than JavaScript, it warns you of potential issues that may actually work just fine once transpiled in JS.
In this specific case, this is simply due to the pseudo private properties ("_popup" follows the usual JS libraries convention of using an underscore _ prefix to denote pseudo private members) not being declared on the TS types of Leaflet, since you are not expected to use them.
But of course this is still technically valid in JS, so you can tell the TS compiler "I know what I am doing" by using the //#ts-ignore comment directive just above that line.
Or longer but much better, since you can remain under TS watch: use actual Leaflet API to achieve what you are doing:
getPopup() method
getContent() method
cluster.getAllChildMarkers()[0].getPopup()?.getContent()

Changing materials in Forge

We are currently making the client retrieve the object states when the page loads (which will cause the 'pending' objects in the model to turn into different colors). Then we poll for changes to update the coloring (Firstly: pending object gets colored when the viewer loads, and then we keep polling to check and change state again, to make Forge render those in a different color and store their old color/material. When the polling received a change that an object should no longer be colored, it tells Forge to use the old color/material again.
The problem:
We've found out what the problem is, but we couldn't find out how to fix it. The problem is that changing materials in Forge doesn't work after startup anymore, it only works in the first ~3 seconds or so (the materials were used to show the colors).
However, setting overlays works even after the first ~3 seconds, (showing overlays instead of materials to show the colors).
This is not what we want to achieve. This looks unoptimized, because overlays will be shown through everything.
The materials, however, seem to be 'locked', as in, they cannot be changed anymore after the first ~3 seconds. It seems like they aren't refreshed or something
In the examples, we found they used viewer.impl.invalidate(true) to refresh the Forge viewer, but that doesn't do anything after ~3 seconds.
We've also tried every combination of viewer.impl.invalidate(true, true, true) as well as setting material.needsUpdate to true, as well as trying to re-render the entire scene.
We also found this: https://github.com/mrdoob/three.js/issues/790, but we couldn't find a good way to do that in Forge, we tried viewer.requestSilentRender() but that didn't do anything either.
Anyway, we've tried everything we could come up with and could find online to make the materials work, but nothing made a difference.
We are looking to find someone that's more experienced with how Forge works that can see what the material code is doing wrong.
As for the content, here is all the code you will need to understand what is happening:
DROPBOX LINK
And here is a small part of the "index.html" file that sets the color:
try
{
viewer.restoreAllColorOverlays(); //for materials instead of overlays: viewer.restoreAllColorMaterials();
$.each(colors, function(color, selectionIds)
{
viewer.setColorOverlay(selectionIds, color); //for materials instead of overlays: viewer.setColorMaterial(selectionIds, color);
});
}
catch(error)
{
console.error(error);
}
I have no idea how you implement your app, so I only tell what I found in your codes. If you want to resolve the issue you addressed, you can consider providing a reproducible case demonstrating that, I will gladly pass it to our dev team. Those following items should be in the reproducible case:
A short exact description of what you are trying to achieve. The behavior you observe versus what you expect, and why this is a problem.
A complete yet minimal sample source model to run a test in.
A complete yet minimal Forge app that can be run and debugged with a simple procedure to analyze its behavior lives in the sample model.
A complete yet minimal pure three.js app that can be run and demonstrated the shader effect you want. Note. Forge Viewer is using r71 three.js.
Detailed step-by-step instructions for reproducing the issue, e.g. which element to pick, what command to launch etc.
If your reproducible case could not be posted here publicly, please send it to the forge.help#autodesk.com and remove sensitive data or information before you send.
=== Something I found in your codes:
I found here are some wrong types and missing actions in your ColorMaterial extension. The color property of an material should the a type of the THREE.Color. Here is my modification:
Autodesk.Viewing.Viewer3D.prototype.setColorMaterial = function(objectIds, color)
{
if( !(color instanceof THREE.Color) ) throw 'Invalid argument: Color';
var material = new THREE.MeshPhongMaterial
({
color: color,
opacity: 0.8,
transparent: true
});
viewer.impl.matman().addMaterial( 'ColorMaterial-' + new Date().getTime(), material, true );
// ...........
};
Its' result is here:
In the ColorOverlay extension, The type of material color property is also wrong, it should be a type of THREE.Color, too. Changing it into THREE.Color should work fine. In addition, overlay is covers on 3D objects, so you should call viewer.hide() with your setColorOverlay() together. Otherwise, it won't look like a transparent object.
Without hidding 3D object of the wall:
hide 3D object of the wall:

import polymer core-scaffold breaks google maps

I have some working dart polymer code that shows a google map with some markers on it. It took me a while to get those to show up, as it seems the initialization routines are a bit wonky and it's as if sometimes there is not enough time to load the map div before it tries to render. Anyway, as I said I got that working. Now I wanted to put a core-scaffold around it, as they do on many demos. The minute I add this line...
<link rel="import" href="packages/core_elements/core_scaffold.html">
...the whole thing breaks, i get the console error:
Exception: Class 'GElement' has no instance method '[]'.
NoSuchMethodError: method not found: '[]'
Receiver: Instance of 'GElement'
Arguments: ["maps"]
I commented out all other lines and reduced it to just that one.
(As of today), using DartEditor 1.5.8 and upgrading to polymer 0.12.0
dependencies:
polymer: '>=0.12.0 <0.13.0'
this upgrades core_element and paper_element to 0.1.x (was 0.0.x before). This now looks fixed (although there seems to be still issues with icon by ids) and I'm able to run a simple scaffold example (https://github.com/dart-lang/core-elements/blob/master/example/core_scaffold.html). you might want to give it another try!
I once ran into a very similar error message when I first tried to use google_maps and eventually figured out that the problem was that I was missing this line in my index.html.
<script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>

Google Map Pins Missing

I have a site using Google map but is now having pins disappear. The code that create the pins are valid and have already been tested. From the inspector, they all seem to be pointing to the a.xa.Fa property in http://maps.gstatic.com/intl/en_us/mapfiles/api-3/13/9/main.js which I believe is injected (as I have included no such script).
I'm quite desperate and have no idea what to do with it. So any input is appreciated.
You try to add markers without supplying a proper pin-argument to add(), therefore the creation of new google.maps.MarkerImage(pin) will fail in add().
This happens the first time at the 6th marker(that's why you see only 5 markers, the error will stop the script-execution at this point).
Solution: you may either fix it(supply a proper pin-argument), there is also a LatLng of 0,0 provided, I guess something went wrong with your data.
or add this to the begin of add() to have a default-pin for these situations:
pin=pin||'http://www.mychinaroots.com/wp-content/themes/mychinaroots/images/8-default.png';