57265

Draggable, on Google AppMaker

Question:

I want a little guidance, because I haven't found the explanation I need yet.

I'm developing a website on Google App Maker, and I want to use on Google Map Widget a Draggable Marker.

All the info I have found, is like for an external website including HTML and JavaScript libraries. The error is shown when I type:

var marker = new google.maps.Marker({ position: latlon, map: map, draggable: true, title:"Drag me!" }); <blockquote>

"Uncaught TypeError: google.maps.Marker is not a constructor at var marker = new google.maps.Marker ({ (NewScript1: 143) ".

</blockquote>

I have tried in client side script, and in server side script.

Question, if I want to use a marker I need to add libraries to appmaker?

Answer1:

Most likely you are getting the error because you are executing your client script before Maps API is loaded. To be 100% sure that it is loaded you need to execute your code in onAttach event of the Google Map Widget (maybe onDataLoad one will work as well).

If you want to make the Marker that App Maker adds to the map by default draggable you can use this snippet:

<pre class="lang-javascript prettyprint-override">// Google Map widget's onAttach event handler var marker = widget.getAddressMarkerJs(); marker.setDraggable(true);

In case you want to add all-new marker(s) you can use this snippet:

<pre class="lang-javascript prettyprint-override">// Google Map widget's onAttach event handler var map = widget.getMapJs(); var marker = new google.maps.Marker({ position: { lat: 0, lng: 0 }, map: map, draggable: true, title:"Drag me!" });

<strong>Bonus</strong> snippet to remove default marker from the map

<pre class="lang-javascript prettyprint-override">// Google Map widget's onAttach event handler var marker = widget.getAddressMarkerJs(); marker.setMap(null);

Answer2:

If you want to use Google Maps, you need to consider it as a widget in the App Maker API which is slightly different from the Google Maps API you are using.

If you look at the App Maker API you will see how you can add markers to a maps widget and how to return them: <a href="https://developers.google.com/appmaker/scripting/api/widgets#GoogleMap" rel="nofollow">https://developers.google.com/appmaker/scripting/api/widgets#GoogleMap</a>

Recommend

  • Getting map location Python
  • JSeperator in JToolBar moves the components to right end
  • Draw a bitmap from a control taller than the screen
  • Very basic javascript function call
  • Cluster markers with osmdroid
  • jQuery UI .sortable() call is slow when applies to thousands of elements
  • How to use OnMarkerClickListener
  • Remove previous Directions Route Google Maps
  • Javascript: Looping through an array to create listeners, issue with call by reference and value?
  • UIAlertController button function not working
  • Android Google Maps API v2 start navigation
  • Insert new calendar with SyncAdapter- Calendar API Android
  • How can I enlarge video fullscreen without the affected interface project in as3?
  • Blackberry - Custom EditField Cursor
  • Seeking advice on Jetty HttpClient Hang
  • Body moving without any force applied? (Box2d)
  • Jenkins: How To Build multiple projects from a TFS repository?
  • Why HTML5 Canvas with a larger size stretch a drawn line?
  • How to add a column to a Pandas dataframe made of arrays of the n-preceding values of another column
  • script to move all files from one location to another location
  • Can a Chrome extension content script make an jQuery AJAX request for an html file that is itself a
  • Google cloud sdk not working when python points python3
  • How to disable jQuery.jplayer autoplay?
  • How to delete a row from a dynamic generate table using jquery?
  • How can I get HTML syntax highlighting in my editor for CakePHP?
  • using HTMLImports.whenReady not working in chrome
  • How do I configure my settings file to work with unit tests?
  • How to stop GridView from loading again when I press back button?
  • Android Google Maps API OnLocationChanged only called once
  • IndexOutOfRangeException on multidimensional array despite using GetLength check
  • Authorize attributes not working in MVC 4
  • Bitwise OR returns boolean when one of operands is nil
  • EntityFramework adding new object to nested object collection
  • sending mail using smtp is too slow
  • Busy indicator not showing up in wpf window [duplicate]
  • Running Map reduces the dimensions of the matrices
  • Why is Django giving me: 'first_name' is an invalid keyword argument for this function?
  • Binding checkboxes to object values in AngularJs
  • How can I use `wmic` in a Windows PE script?
  • Android Heatmap on canvas or ImageView