How I integrated OpenLayers in React Native

Поделиться
HTML-код
  • Опубликовано: 29 ноя 2024
  • НаукаНаука

Комментарии • 18

  • @marvinfok65
    @marvinfok65 3 месяца назад +1

    Thank you so much, there are so few OpenLayers map tutorials for react native in RUclips!

  • @areshkaa
    @areshkaa Год назад +2

    you saved my life, man

  • @nickimberlin
    @nickimberlin 9 месяцев назад +2

    I need to build this 😮. You are some type of genius wizard! Thank you for the video!

    • @PhanxDEV95
      @PhanxDEV95  9 месяцев назад

      Thank you for your nice comment :)

  • @jenialherdianto292
    @jenialherdianto292 3 месяца назад +1

    you're jenius, man

  • @Ashur-lab
    @Ashur-lab 4 месяца назад +1

    Hello sir. Huh do you have any tutorial on how to start using OpenLayers on react js? I love your video !!

    • @PhanxDEV95
      @PhanxDEV95  4 месяца назад

      Thank you for your comment:)
      Maybe this video can help you: How to get started with OpenLayers in React JS
      ruclips.net/video/okcnlN91dC0/видео.html

  • @jairosnyirenda
    @jairosnyirenda 7 месяцев назад +1

    This is amazing. Thank you. But now, how can you pass the GEOJson dynamically to the map? Let's say an API call that returns GEOJson data that needs to be rendered on the map?

    • @PhanxDEV95
      @PhanxDEV95  7 месяцев назад

      Thank you for your kind words :)
      To answer your question: In the main.js file of the OpenLayers web app, you could add another function to the window object, just like you saw it in the video with the "zoomToGeoJSON", maybe you want to call it something like "addGeoJsonFeatuers". This function could have a parameter, which is the GeoJSON result from the API call and it will add the features to the GeoJson source (variable name "geoJsonSource" in the example) via "addFeatures". You can then call this function from react native just like the zoomToGeoJSON function in the example.
      I hope this is a help for you

    • @jairosnyirenda
      @jairosnyirenda 7 месяцев назад +1

      @@PhanxDEV95 Thank you, let me try this and get I will get back to you once done!!!

  • @AnupamSharma-sh6vo
    @AnupamSharma-sh6vo 4 месяца назад

    Hey, working on a Cab Facility app , can you advice me how to use this map somewhat like Uber, where we have markers , geocoding , reverse geocoding ?

    • @PhanxDEV95
      @PhanxDEV95  4 месяца назад

      Hello. Thank you for your comment :) (And sorry for the late response)
      Look at this OL example: openlayers.org/en/latest/examples/modify-icon.html. You should be able to do something similar to implement markers. Always keep in mind, that you put the JS code that interacts with OpenLayers has to be put in the Wep application, if you need some kind of interaction with the React Native app itself, you need to define global functions on the window object of the web app.
      Regarding geocoding: I do not really have experience with that to be honest, but I know that there are pretty cool services for that from Google. I would try to integrate them in the wep app part of the project.
      I hope this helps a little :)

    • @AnupamSharma-sh6vo
      @AnupamSharma-sh6vo 4 месяца назад

      @@PhanxDEV95 Thanks a lot mate.

  • @andriikostenko2379
    @andriikostenko2379 6 месяцев назад +1

    nice, thanks

  • @luzianaassuncao4587
    @luzianaassuncao4587 9 месяцев назад +1

    muito obrigada!!!😍😍

    • @PhanxDEV95
      @PhanxDEV95  9 месяцев назад

      You‘re welcome 😅

  •  Год назад +2

    Muito bom.

  • @labibhassan6679
    @labibhassan6679 10 месяцев назад +1