Using google maps api in custom widget of ThingsBoard.io - google-maps

In ThingsBoard.Io you can create your own custom widget and I would like to be able to use the google maps library in it. However i can't get the library to load correctly.
I'm adding "http://maps.googleapis.com/maps/api/js?key=ABC" (also adding callback parameter doesn't help) to the resource tab and the error I get back is "Error: TypeError: $ is not a constructor
Line 636 column 31338 of script."
Anyone a solution to alternatively load that google library correctly?

Add this to the HTML tab in the widget editor solved the problem:
<script src="https://maps.googleapis.com/maps/api/js?key=API_KEY"></script>

Related

Possibility of opening an extension within another extension in Autodesk Forge

Is it possible to open a custom extension thorough another custom extension ?
I tried but I get issues at the time of "Autodesk.Viewing.UI.DockingPanel.call" not sure whether I have done it properly or it is possible at all .
My use case :
I need to create a report, which contains some additional data that needed to enter at runtime plus a screenshot of the current view.( for this i have one extension).
Above extension need to open through markup extension so I can add annotation and save the screenshot.
Cheers
edit
is it possible to add a custom extension to a core extension as well ?
viewer.loadExtension("Autodesk.Viewing.MarkupsGui").then(function (extension_)
{
viewer.loadExtension('CreateNcrExtension');
});
This actually doesn't work . No error but wont load as well
Loading extensions from another extension is common, and usually done in your extension's load method. The load and unload methods can be async, so you can do something like this:
class MyAwesomeExtension extends Autodesk.Viewing.Extension {
// ...
async load() {
await this.viewer.loadExtension('Autodesk.Viewing.MarkupsCore');
return true;
}
// ...
}

react-google-maps OverlayMapType support

I'm trying to implement an ImageMapType as an overlay using react-google-maps. This works fine on vanilla Google Maps as per the documentation.
However with this library, there is no overlayMapTypes array in the returned map object. Below is a code snippet adapted from the demo website:
handleMapLoad(map) {
this._map = map;
this._navOverlay = new google.maps.ImageMapType(NAV_OVERLAY_OPTIONS);
this._map.overlayMapTypes.push(this._navOverlay);
}
// throws error 'Cannot read property 'push' of undefined'
I did find an overlayMapTypes array inside map.context.__SECRET_MAP_DO_NOT_USE_OR_YOU_WILL_BE_FIRED but I have a feeling I shouldn't be using that.
So how do I do it?
If it is not there, then you can
a) Use the private values as a temporary solution
b) Develop an expansion of the library and make a pull request there. This is very similar to a, but when you are developing "inside" the library, now you have proper access.

Use google map API in a react babel component

I currently try to use google map API with react js and babel. I don't want to use the existing react components (that are uncomplete).
The problem I encounter is that I can't load the google map object. Babel always show me a compilation error like this one :
error 'google' is not defined
Event if I load the google map script in my index :
<script src="https://maps.googleapis.com/maps/api/js?key=MY_KEY&libraries=places&callback=initAutocomplete" ></script>
I understand that babel doesn't load the google map library at compile time, but try to compile some code lines like this :
var map = new google.maps.Map(document.getElementById('map')...
Is there someone who know how to handle this case ?
Thank you
Install the google maps api npm module and import it into your relevent files. https://www.npmjs.com/package/google-maps

nativescript-google-maps-sdk use native calls to style the map

I successfully integrated a google map at my angular2+nativescript project. Everything I needed from the typescript definition file is working for me.
However, I wanted to play around with the styling of the map. AFAIK, I have to use native calls to the map, as the method setMapStyle() is not in the typescript definition.
I thought I could use the gMap property to access the native object and call the method. But I fail in setting up the right parameter as requested in google docs (https://developers.google.com/maps/documentation/android-api/styling) as I dont know how to create a MapStyleOptions object. The type is unknown.
Anyone tried or succeeded in this task yet and want to share some hints? How would you access native GoogleMap?
NativeScript allows you to access all public API of plugins used in the app, therefore you should be able to make native calls to the Map API as per the documentation at nativescript.org
If you want to create a MapStyleOptions object for example, you'd write
var MapStyleOptions : any = com.google.android.gms.maps.model.MapStyleOptions;
var mapStyle : any = new MapStyleOptions({"..":".."});
or just var mapStyle = new com.google.android.gms.maps.model.MapStyleOptions({"..":".."});
When TypeScript complains about com.google... not being recognized, you can either define it as any or import some ready to use typings.
Good luck!

How to share Spreadsheet with reference to a custom (private) library

I've build Spreadsheet with a lot of google script code. It started as a personal spreadsheet and script, but more people want to use my spreadsheet. I doesn't want to share the google script code to the other people, but sharing the spreadsheet is ok.
So I've created a separate Google Script project and published a version and included that version in the spreadsheet. This works great for me as owner of the spreadsheet and script.
Now I've shared the spreadsheet. That people make a custom copy of the sheet and tried to use it. When running the function in the sheet (referencing to the library):
1) getting the question to give the script the right authorisation, on base of the functions in the custom library.
2) After that Google gives a error: You do not have access to library xxx, used by your script, or it has been deleted.
So the enduser have edit right to the sheet, but the custom library is only for me. I can make this working by publishing the custom library as available for anyone with the link with EDIT rights.
Is there a way to fix this? The code in script is very important to ensure that nobody may see what's happening there.
hmmm giving al users read right, means they can access my sourcecode. Will there be no option to prevent that? Loading sourcecode form external source for example?
Another issue with giving the user read rights. I've created two custom libraries, one with the public functions and one with the private functions. The public functions library holds all the public getter and setters.
So in the sheet code there's a function:
function GetInformation()
{
LKfunctions.GetInformation();
}
LKFunctions is the public library. In the public library i've included the private library as LKfunctionsPrivate. So the function in the public library is:
function GetInformation()
{
var parsedData = LKfunctionsPrivate.getLK_JSON();
if (parsedData != "")
{
LKfunctionsPrivate.FillSettingsSheet(parsedData);
LKfunctionsPrivate.FillCastleSheet(parsedData);
}
}
When I execute the function the sheet I get the error:
"ReferenceError: 'LKfunctions' is not defined. (line 6, file 'publicFunctions.gs'
That's very strange because publicFunctions that function has the content:
LKfunctionsPrivate.getLK_JSON();
So how can the script gives me a error on LKfunctions, when using LKfunctionsPrivate. When I debug I indeed that the line is edited to LKfunctions.getLK_JSON();
Very strange.
Looks this works indead. I've merged my private and public function library to one.
One problem. I'm using a external library called Moment in my function library.
https://script.google.com/macros/library/versions/d/MHMchiX6c1bwSqGM1PZiW_PxhMjh3Sh48
When including my library, I must enable development mode on the function library to work correctly. When anyone else using my script or I disable development mode, we got the error message:
ReferenceError: "Moment" is not defined. (line 5, file "constants", project "Lords and Knights functions")
Here is an example for you to test and to check that users don't have to have edit rights on the script source.
Use this example in a spreadsheet :
//Library Project key : M_ZIuMRltotjhyMdhBDVG76tIT_UhbT9n
// choose stable version.
function test(){
testLib.searchUI();
}
it will create a small UI in your spreadsheet... the library script is viewable to anyone with the link but no one has the link