• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
MagicMirror Forum
  • Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
A New Chapter for MagicMirror: The Community Takes the Lead
Read the statement by Michael Teeuw here.

MMM-google-route Example ?

Scheduled Pinned Locked Moved Solved Troubleshooting
14 Posts 4 Posters 6.6k Views 4 Watching
Loading More Posts
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • B Offline
    bleusswissbless
    last edited by bleusswissbless Jan 30, 2019, 7:02 PM Jan 29, 2019, 10:01 PM

    Hi guys :)

    I’m trying to configure MMM-google-route on my mirror. I tried to follow step and google link but, hmm, I don’t f*** understand anything about how it works :D
    Am I such a noob ? :) I coudldn’t found anything about this module on the forum. I need at list a sample configuration for origin and destination parameters. If someone could share something !? thanks guys :)

    1 Reply Last reply Reply Quote 0
    • V Offline
      Valkilane
      last edited by yawns Jan 31, 2019, 10:10 PM Jan 31, 2019, 11:00 AM

      This is what i’ve done to get it up and running:

      active the google api’s: (sign-up, follow the path mentioned in the short description provided by the module)

      activated APIs:

      Directions API (if I disable it nothing works anymore)
      Geocoding API
      Maps JavaScript API
      

      then add this to your config.js:

      {
                  module: 'MMM-google-route',
                  position: 'bottom_left',
                  config: {
                      height: '150px',
                      width: '300px',
                      key: 'your-google-apikey',
                      directionsRequest:{
                          origin: 'city country',
                          destination: 'city country'
                      }
                  }
              },
      

      Hope this works, did for me!

      F 1 Reply Last reply Oct 18, 2019, 1:28 AM Reply Quote 1
      • B Offline
        bleusswissbless
        last edited by bleusswissbless Feb 1, 2019, 6:39 PM Feb 1, 2019, 6:38 PM

        it was so simple ! :D
        i tried with “Address city country” for both origin and destination field… it works !! I think manual could be more precise on this point. Thank you very much @Valkilane

        1 Reply Last reply Reply Quote 0
        • F Offline
          FruityBebbles @Valkilane
          last edited by FruityBebbles Oct 18, 2019, 1:31 AM Oct 18, 2019, 1:28 AM

          @Valkilane Hi, I know this is a bit old but what if you wanted to be more specific because the origin and the destination are both located in the same city…
          Im trying to use my address as the origin and a well known hospital in the city as the destination…

          my config is

          module: "MMM-google-route",
          	position: "top_left",
          	config: {
          		key: "google api-key",
          		directionsRequest:{
          		origin: "address, city, country",
          		destination: "lat", "lng", // can't figure out...
          		height: "400px",//default=300px
          		width: "400px",//default=300px
          		avoidTolls: true,
          		showAge: false,
          		fontSize: "80%",
          			}
          		}
          	},
          

          Do you know what order I have to put the coordinations in, so i can get this to work?

          S 1 Reply Last reply Oct 18, 2019, 2:23 AM Reply Quote 0
          • S Away
            sdetweil @FruityBebbles
            last edited by Oct 18, 2019, 2:23 AM

            @FruityBebbles looks like the doc for the module references a google doc with says

            directionsRequest	Required The directions to show on the map.
            Type: google.maps.DirectionsRequest interface
            

            direction request link takes you here

            https://developers.google.com/maps/documentation/javascript/reference/directions#DirectionsRequest
            

            which says LatLng or LatLngLiteral
            https://developers.google.com/maps/documentation/javascript/reference/coordinates#LatLngLiteral

            which both show as this

            {lat: -34, lng: 151}
            

            so

            module: "MMM-google-route",
            	position: "top_left",
            	config: {
            		key: "google api-key",
            		directionsRequest:{
            		origin: "address, city, country",
            		destination: {"lat": number, "lng":number}, // can't figure out...
            		height: "400px",//default=300px
            		width: "400px",//default=300px
            		avoidTolls: true,
            		showAge: false,
            		fontSize: "80%",
            			}
            		}
            	},
            

            Sam

            How to add modules

            learning how to use browser developers window for css changes

            F 1 Reply Last reply Oct 18, 2019, 1:18 PM Reply Quote 1
            • F Offline
              FruityBebbles @sdetweil
              last edited by FruityBebbles Oct 18, 2019, 1:19 PM Oct 18, 2019, 1:18 PM

              @sdetweil Thankyou for laying it out for me! I was trying to put

               destination: [lat: number,  lng: number]
              

              instead of

              destination: {"lat": number,  "lng": number},
              
              • I didn’t know to add the “” or the {}

              now, my config looks like:

              module: "MMM-google-route",
              	position: "top_left",
              	config: {
              		key: "google api-key",
              		directionsRequest:{
              		origin: "address, city, country",
              		destination: {"lat": number, "lng": number},
              		height: "400px",//default=300px
              		width: "400px",//default=300px
              		avoidTolls: true,
              		showAge: false,
              		fontSize: "80%",
              			}
                         }
              },
              

              I am getting a 400px by 400px box showing up in the “top_left” of my mirror, but now it’s all white with no map being shown…

              S 1 Reply Last reply Oct 18, 2019, 1:31 PM Reply Quote 0
              • S Away
                sdetweil @FruityBebbles
                last edited by Oct 18, 2019, 1:31 PM

                @FruityBebbles said in MMM-google-route Example ?:

                origin: “address, city, country”,

                you of course set a good start point (origin) with the real location, right?

                a good lat/lng near me is { “lat”: 31.4490047,“lng”:-98.6031736}

                Sam

                How to add modules

                learning how to use browser developers window for css changes

                1 Reply Last reply Reply Quote 0
                • F Offline
                  FruityBebbles
                  last edited by sdetweil Oct 18, 2019, 1:49 PM Oct 18, 2019, 1:47 PM

                  yes… I should have said that my origin is the lat/lng

                  origin: {"lat": , "lng": }
                  

                  and my destination is the

                  address, city, country
                  

                  but to make things more translucent, here’s my config:

                  {
                  module: "MMM-google-route",
                  position: "top_left",
                  config: {
                  	key: "api-key", 
                  	directionsRequest:{
                  		origin: {"lat": 40.0583287, "lng": -75.0074246},
                  		destination: "3401 Civic Center Blvd, Philadelphia, US",
                  			height: "400px",//default=300px
                  			width: "400px",//default=300px
                  			avoidTolls: true,
                  			showAge: false,
                  			fontSize: "80%",
                  			}
                  		}
                  	},
                  
                  S 1 Reply Last reply Oct 18, 2019, 1:50 PM Reply Quote 0
                  • S Away
                    sdetweil @FruityBebbles
                    last edited by Oct 18, 2019, 1:50 PM

                    @FruityBebbles please use code blocks

                    anyhow, try this lat/lng for your destination

                    39.9487306,-75.1965791

                    i don’t know anything about this module

                    Sam

                    How to add modules

                    learning how to use browser developers window for css changes

                    F 1 Reply Last reply Oct 18, 2019, 2:00 PM Reply Quote 0
                    • F Offline
                      FruityBebbles @sdetweil
                      last edited by Oct 18, 2019, 2:00 PM

                      @sdetweil said in MMM-google-route Example ?:

                      @FruityBebbles please use code blocks
                      I thought I did… my bad

                      anyhow, try this lat/lng for your destination

                      39.9487306,-75.1965791

                      I did, but no change…

                      i don’t know anything about this module

                      hahah could have fooled me =)
                      but no, you’ve gotten me closer to having this work than I have on my own so I thank you a lot.

                      F 1 Reply Last reply Oct 18, 2019, 10:42 PM Reply Quote 0
                      • 1
                      • 2
                      • 1 / 2
                      • First post
                        Last post
                      Enjoying MagicMirror? Please consider a donation!
                      MagicMirror created by Michael Teeuw.
                      Forum managed by Sam, technical setup by Karsten.
                      This forum is using NodeBB as its core | Contributors
                      Contact | Privacy Policy