Add Custom Markers Add Polylines in Google Map

[Albert Paul]

Thunkable just added some very awesome features - adding customer markers and polylines to Google Map ...

http://bit.ly/2mnlcAw

http://bit.ly/2mnplEi

Can we have something like this in App Inventor please?

[SteveJG]

Polylines and custom markers (and markers with labels) are already possible with App Inventor 2 when working with Static Maps. The developer just has to provide the blocks.

See Google's Map API (  https://developers.google.com/maps/documentation/static-maps/intro#quick_example ) and page down to the sections on markers and custom markers and path points 

Path Points

In order to draw a path, the path parameter must also be passed two or more points. The Google Static Maps API will then connect the path along those points, in the specified order. Each pathPoint is denoted in the pathDescriptor separated by the | (pipe) character.

The following example defines a blue path with default 50% opacity from Union Square NY to Times Square, NY.

The specifics of the path parameter appear below:

path=color:0x0000ff|weight:5|40.737102,-73.990318|40.749825,-73.987963|40.752946,-73.987384|40.755823,-73.986397

So, "Can we have something like this in App Inventor please?" --- we already do although the developer has to do more coding using a StaticMap.  StaticMaps can be called with either ActivityStarter or the WebViewer.   

Edit:  here is an AI2 example

The center directive is not really needed if you specify two or more locations (it is grayed out in this image).    This was built as a Procedure and using the Google Map API calls.  Try it.  Custom icons are more difficult.  I have not attempted it but they should be possible; in fact, anything in the API should be doable.

Oh, that was easier than I thought.  :)

  You might be able to contribute something similar to what third party AI versions provide using Extensions or if you are an acomplished Java coder by developing the appropriate code and sharing with the AI community -- AI2 is OpenSource 

MIT App Inventor Sources

MIT once had a mapping component prototype for AI ... it apparently was abandoned about a year and a half ago.

An issue here is MIT finding the time and resources to specifically develop special mapping tools given the many other requests they receive.   This idea is a good one.  The MIT development team do read these posts so they will get your message Albert.   I would certainly like a mapping tool too but at the present can code around the fact there are not specific tools.

Regards,

Steve

[SteveJG]

To post the red smiley on the map  

you can use either the encoded method     &markers=anchor:topright%7Cicon:https://goo.gl/1oTJ9Y%7C40.752946,-73.987384  (Read about the encoding in Google's documentation.)

or use the full path to the png image     &markers=anchor:topright%7Cicon:https://developers.google.com/maps/documentation/static-maps/images/smiley.png%7C40.752946,-73.987384

Use the encoded method.  Why?   The API limits the number of characters that can be used in the calling URL script so you want to minimize the characters you use in the URL.

Regards,

Steve