(for Thunkable X) Overlay for Map, color and icon for Markers, onPress for Polygon and Polyline

[AlexITMan]

The Map component in React Native has some very interesting functionality that will be valuable in Thunkable X as well. I understand that it will not be possible to make a full Canvas and working with sprites from Map, but my experiments show that some Canvas functionality can be implemented using Map (if it is easier for developers to do this compared to creating a full Canvas).

[mark-friedman]

Just so you know, we are currently working on a Canvas component, so please be patient 😉 Hopefully it will be worth the wait.

[AmigoDeluxe]

@AlexITMan have you been able to use canvas or any other approach to add custom-coloured pins? I need this functionality and I wonder if you've had any luck.

[AlexITMan]

@AmigoDeluxe To add color pins you need to work directly with Google Map API in WebViewer via Javascript

[AmigoDeluxe]

@AlexITMan that won't be an option for me. I am using the Map component to drop pins and draw polylines so I am interested in being able to define the colours of the pins in the component, not in a webviewer pointing to a map on Google.

@mark-friedman is this being worked? Any ETA? Thanks!

[AlexITMan]

@AmigoDeluxe If you create all pins with different colors yourself, then you can save the color of the polyline that is attached to the pin in the list of objects along with the coordinates of the pin.

[AmigoDeluxe]

@AlexITMan thanks for your response. I have been scratching my head over your message for the past hour and just can't find a way to do what you describe. How can I create all pins with different colors myself? Remember, I am not using any already existing Google Map. I am using the Map component and dropping Pins on the map using the "addMarker" option. If you can demonstrate what you describe in a sample project, it would be massively appreciated.

[AlexITMan]

@AmigoDeluxe Each of the pins have the coordinates of the latitude and longitude. This means that you can use these coordinates to print a square of the desired color next to the pin using these coordinates.

[AmigoDeluxe]

@AlexITMan supposing I did that, wouldn't the squares scale in size when the user zooms in and out of the map? On the contrary, the size of the pins remains the same regardless of the zoom level so if my assumption is correct, your workaround is not going to be effective. I believe we need a proper, supported solution to this issue: We need to be able to select the colour of the pins.

We should also be able to edit pins, polygons and polylines individually.

[AlexITMan]

@AmigoDeluxe The dimensions of the polylines will be scaled when the map is scaled. But this is the only solution. If you look at the date of this topic, you will see that 1 year has already passed. How long are you willing to wait for this feature? Another question is, are you sure that it will ever be implemented?

[AmigoDeluxe]

I guess that is a question for @mark-friedman and I just hope this has not fallen through the cracks, even though the feature request has been open for a long time. Patience is a virtue.

When it comes to your solution, I kinda like it, my case has to do with showing the position of a bus on the map. The position gets updated every 30 seconds so as we can't delete polygons, I would have to delete the entire map, create a new one and re-populate it with the required details (bus stops and bus position). This is why I need the abovementioned capabilities... Oh.. plus being to define a custom pin icon :-D. @mark-friedman, pleeeeease?

[AlexITMan]

@AmigoDeluxe You can solve your problem without using colored pins. Add additional parameters to the list of pin objects. After that, you can filter pins by these parameters and you need to determine the values of these parameters, not the color of the pin. Will this solution work for you?

[AmigoDeluxe]

@AlexITMan worst case, I would use the proposed approach however, there is no functionality to delete polylines and polygons so when I would need to change the coordinates of the pin (and the polygon), I would need to delete the entire map and re-populate it with the new details. That's why it would be helpful to be able to edit the details of pins (and polygons) individually. In my case, being able to control the colour and properties of the individual pins (and perhaps the icons of the pins as well :-) ) would be great.

K

[AmigoDeluxe]

I mean... https://github.com/react-native-community/react-native-maps

[AlexITMan]

@AmigoDeluxe Well, my last suggestion doesn't apply to polylines at all. I suggest you use only pins and a list of objects where each object is a pin + color.

[mark-friedman]

@AmigoDeluxe I'm afraid that I am no longer with Thunkable and therefore will be unable to help you with this.

[AmigoDeluxe]

@mark-friedman oh! Sorry to hear! @josmas ? :-)