Ionic 6 Google Maps 🔥 - New Capacitor Official Plugin implementation | Setup Google Maps API Key

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

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

  • @CodingTechnyks
    @CodingTechnyks  2 года назад +7

    Hello friends, I found a way to set marker at current location and a few more interesting stuff related to move map listeners. If you want an episode 2 of this google maps plugin then comment below, will launch a video on that this sunday if I get atleast 10 comments (just to know that the content will be worth)...thank you

    • @emna_h
      @emna_h 2 года назад

      yes please we need this content

    • @CodingTechnyks
      @CodingTechnyks  2 года назад +3

      Already done check the latest video

  • @princedarko6020
    @princedarko6020 2 года назад +3

    hey ... nice tutorial.. please can you add something like a polyline between two markers and perhaps display their distance?

  • @SuperShivammm
    @SuperShivammm 2 года назад

    We are very thankful for your contribution to angular and firebase developers

  • @timodev
    @timodev 2 года назад

    Great video, currently working on a college project and you uploaded just in time.

  • @abdulazizalsalmi1467
    @abdulazizalsalmi1467 Год назад

    Thanks a lot for the video I appreciate, also I am following your tutorials in Udemy, is there away to make a route between more that 2 points and how?
    Also is there away to make the user chose from an ion-select then it will show the place with the name selected by the user?

    • @CodingTechnyks
      @CodingTechnyks  Год назад +1

      Everything is possible that you can do in Google maps, you can achieve the same to a great extent

    • @abdulazizalsalmi1467
      @abdulazizalsalmi1467 Год назад

      @@CodingTechnyks Thanks a lot

  • @ericamarchi2699
    @ericamarchi2699 Год назад

    Amazing tutorial, thank you! I hope that Capacitor team will improve this plugin soon because I think should have more customization options :)

  • @علياءاسامه-ت4م
    @علياءاسامه-ت4م 2 года назад

    Great tutorial . Wait for more useful videos

  • @hibahorchani784
    @hibahorchani784 Год назад

    This video helped me a lot thank you, is there any possible way to check live data/info of the traffic between two points in google maps API?

    • @CodingTechnyks
      @CodingTechnyks  Год назад +1

      Get current location
      Save in server
      Fetch it and update the points
      You can use real-time database of firebase or even firestore for real-time data

  • @HuubHaex
    @HuubHaex Год назад

    how can you implement the ngOnInit, ngAfterView functions if you haven't put it in your implements from your class??
    it normally would give an esLint error or am i wrong?

    • @CodingTechnyks
      @CodingTechnyks  Год назад +1

      Ngoninit and ngafterviewinit comes with interface Oninit
      Just implements Oninit

    • @HuubHaex
      @HuubHaex Год назад

      @@CodingTechnyks indeed! thanks for the quick answer

  • @ballumnientertainment3413
    @ballumnientertainment3413 2 года назад

    Is it possible to custome make an ID number for a marker? Becase i need to remove markers without chicking anything

    • @CodingTechnyks
      @CodingTechnyks  2 года назад

      Well that option is not available
      For confirmation check the documentation once

  • @eunicepinedahenriquez5480
    @eunicepinedahenriquez5480 Год назад

    How do you implement setOnInfoWindowClickListener?

    • @CodingTechnyks
      @CodingTechnyks  Год назад +1

      I will have to check it, I am not sure as no function is present for setting up infowindow in this plugin
      But if you just want to use listener then directly initialise it

  • @wassilahosni9634
    @wassilahosni9634 2 года назад

    Great video

  • @josequintin2467
    @josequintin2467 2 года назад

    Very good!

  • @vyshnavkumar3769
    @vyshnavkumar3769 2 года назад

    This video helped me lot bro Thank you

    • @CodingTechnyks
      @CodingTechnyks  2 года назад

      You can check the course on Ionic if you want link in description

  • @ericamarchi2699
    @ericamarchi2699 Год назад

    I'm implementing this plugin right now and I have a problem. there is a way to prevent on mobile the popup opening when click on marker? I wanna use only the bottom sheet for ios, android and web!

    • @CodingTechnyks
      @CodingTechnyks  Год назад

      That is user controllable because there is no such thing that shows pop up directly
      If still you want more flexible maps then Use Javascript googlemaps

    • @ericamarchi2699
      @ericamarchi2699 Год назад

      @@CodingTechnyks so no way to remove the popup? or hide it with css?

    • @CodingTechnyks
      @CodingTechnyks  Год назад

      @ericamarchi2699 connect via Instagram and share a photo of popup

    • @ericamarchi2699
      @ericamarchi2699 Год назад

      ​@@CodingTechnyks your instagram link in the video description says that the page is not available anymore but I've found the link in your profile. i will connect and show you the photo. thanks

  • @karitoberlanga9201
    @karitoberlanga9201 2 года назад

    Is there a way to plot the optimal route on the map?

    • @CodingTechnyks
      @CodingTechnyks  2 года назад +1

      Not in this plugin, but can be done in JavaScript one, will make a video on it soon

    • @CodingTechnyks
      @CodingTechnyks  2 года назад +1

      But for the optimal route, you can try different google maps api feature, I will show to plot the polyline

  • @finnlau3349
    @finnlau3349 2 года назад

    Hi, Any chance you could do a tutorial on how to add multiples marker using string?

    • @CodingTechnyks
      @CodingTechnyks  2 года назад

      You mean as an object array
      AddMarkers is a function to do so to add multiple markers at once I think I might have shown if not here then check it’s episode 2

  • @emna_h
    @emna_h 2 года назад +1

    I followed same code but Google maps not loading in device (android)but works fine in browser

    • @CodingTechnyks
      @CodingTechnyks  2 года назад +1

      In android or ios?

    • @emna_h
      @emna_h 2 года назад

      @@CodingTechnyks android

    • @CodingTechnyks
      @CodingTechnyks  2 года назад +1

      Ionic 6 Google Maps 🔥 - New Capacitor Official Plugin | Testing in Android & iOS
      ruclips.net/video/75SwV2kNH4o/видео.html

    • @CodingTechnyks
      @CodingTechnyks  2 года назад +1

      Check this latest video, it will be solved

    • @emna_h
      @emna_h 2 года назад

      @@CodingTechnyks ok i will thank you so much

  • @LuisFernandoPimenta
    @LuisFernandoPimenta 2 года назад

    the best

  • @Axelazo
    @Axelazo 2 года назад

    Is there a way to draw a polyline?

    • @CodingTechnyks
      @CodingTechnyks  2 года назад +1

      In this plugin, no option so far

    • @Axelazo
      @Axelazo 2 года назад

      @@CodingTechnyks thank you, I was checking the Capacitor Community version and there is no option for that too :(

    • @CodingTechnyks
      @CodingTechnyks  2 года назад

      Use JavaScript google maps
      You can draw poly line out there

  • @mynameiskg1
    @mynameiskg1 2 года назад

    Hello Friends, Not able to see map on Android.. but I can see running on iOS.
    Did anyone know fix for this?
    In the document it is said that setting transparency on elements such as IonContent and the root HTML tag to ensure that it can be seen. If you can’t see your map on Android, this should be the first thing you check.
    What to do here?

    • @CodingTechnyks
      @CodingTechnyks  2 года назад

      Set ion-content {-background:none} and check

    • @CodingTechnyks
      @CodingTechnyks  2 года назад

      Hi @mynameiskg1, kindly let me know what you did it to work in iOS, for android will post a video tomorrow

  • @Nesbiteme
    @Nesbiteme 2 года назад

    This works great on the web, but I can not get the map to render on an ios device.

    • @CodingTechnyks
      @CodingTechnyks  2 года назад

      On iOS it not working for me also but I am using mac m1, tomorrow will upload a video on that for android and iOS issue also shown in that video, I am sorry, could not help you with that as of now
      You try enabling google maps on android, you check my video tomorrow and let me know if it works for you with those changes for iOS

    • @Nesbiteme
      @Nesbiteme 2 года назад

      @@CodingTechnyks Thank you. I also am using M1 so it will NOT run on simulator due to well known M1 issue. However when I build on my phone no map! I'll wait for tomorrow's video. Thank you for all your help. This is one of the very best videos on this subject.

    • @CodingTechnyks
      @CodingTechnyks  2 года назад

      Thanks Matthew, but I am sorry could not help you with iOS, if I find a better solution will let you know asap

    • @CodingTechnyks
      @CodingTechnyks  2 года назад

      @matthew test it by giving a timeout of 1000 and then call createmap() in ionviewdidenter or ionviewwillenter
      Do let me know if it works or not

    • @Nesbiteme
      @Nesbiteme 2 года назад

      @@CodingTechnyks I will give that a try shortly and report back. Also, some have pointed out that there might be css settings that the Ionic team neglected to mention. For example someone pointed out "the div container must be outside of ion-content. I will be trying these this afternoon and report back. This is very frustrating as I have a project that I need to finish. Thank you!

  • @luisgalicia7790
    @luisgalicia7790 Год назад

    How show infoWindow marker?

  • @avishkarkumbhar3294
    @avishkarkumbhar3294 Год назад +1

    Hello Sir Please launch a course on udemy of Event Management App with certificate generation using IONIC and firebase
    Please sir!!
    it is my humble request

    • @CodingTechnyks
      @CodingTechnyks  Год назад

      hi avishkar,
      i am not sure how many people will buy it,
      you connect via facebook messenger, let me understand what you are looking for