RFC: Update drawPoints method to allow for easier naming of popup markers

[mtliendo]

Background on the drawPoints method

The drawPoints method, exported from maplibre-gl-js-amplify, can be used to add markers to a map.

Using this method to add a marker comes in two types of flavors:

1. drawPoints with an array

drawPoints('name', [arrayOfCoords1, arrayOfCoords2], mapTarget)

2. `drawPoints with Feature GeoJSON

drawPoints('name',
 {
    "type": "Feature",
    "properties": {
        "name": "Coors Field",
        "place_name": "Coors Field Place",
        "amenity": "Baseball Stadium",
        "popupContent": "This is where the Rockies play!"
    },
    "geometry": {
        "type": "Point",
        "coordinates": [-104.99404, 39.75621]
    }
},
    mapTarget)

Currently when using option 1, adding a marker to a map and clicking on the marker, the coordinates are rendered by default inside of a popup.

However with this approach, there is no way to add a custom place name.

Proposed Change

This proposal offers a change to the drawPoints API such that it has an object for the second argument that wraps both the coordinates, as well as a place_name:

drawPoints('sourceName',
  {
     location: [[lat, lng]],
     place_name: 'My place name, my place address'
  }
)

This allows applications such as those wanting to add their inventory locations to a map, a way to easily hard code those values.

Considerations

The rendering library, carmen-geojson uses a comma to separate a title, from an address. In doing so, the text before the comma is used as the title, and the remaining text is used as the description.

This should be highlighted in the Amplify Geo documentation, as well as provide a link to show how developers can create their own marker popup text. This is to inform customers that adding a comma in some scenarios may experience unintended results:

drawPoints('sourceName',
  {
     location: [[lat, lng]],
     place_name: 'Building Constructed on: August, 30 2021 ' // "Building Constructed on: August" would be bold text.
  }
)

[thaddmt]

Marking this complete since the code has been pushed, new version published to npm (v1.1.0) and docs have been updated