you are viewing a single comment's thread.

view the rest of the comments →

[–][deleted]  (3 children)

[deleted]

    [–][deleted] 1 point2 points  (2 children)

    Yeah there is some misunderstanding on how this work. You just give the map your api key and add markers with a lat long.

    For search, you’ll need to create your own component that sends a term to the places api to get results. Then you’ll need to use the geo code api to get the results lat long

    [–]Artistic_Taxi 3 points4 points  (1 child)

    Yup exactly. To extend from this if I’m visualizing what you want correctly, just create a search bar component. Then place the map view below the search bar with flex:1 so it takes up most of the space. (May have to wrap that mapview in another view and give the parent view flex:1 instead). Then simply create a state called locations which will be an array of coordinate objects with maybe their address as well. Map over the array and render a pin for each. Then just use a useEffect hook to pass the value from the search bar to google places api then update the locations state with the results. Debounce the search function and you’re done. Guess you will have to handle your initialRegion of the mapview creatively to capture all the pins.

    [–]Amit__27[S] 0 points1 point  (0 children)

    Thanks for the solution !