• 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.9k 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.
  • 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 Offline
      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 Offline
          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
            • F Offline
              FruityBebbles @FruityBebbles
              last edited by Oct 18, 2019, 10:42 PM

              @FruityBebbles @sdetweil
              Just thought you should know that it works now…
              For some reason

              height: "any sized px",
              width: "any sized px",
              showAge: true/false,
              fontSize:  80%
              

              …were all the issues-- not sure why but I figured I’d let anybody who may be reading this know that you should make sure to get your coordinates or whatever “right,” then deal with the fancy stuff, like fontSize and stuff… fwiw

              S 1 Reply Last reply Oct 19, 2019, 2:08 AM Reply Quote 0
              • S Offline
                sdetweil @FruityBebbles
                last edited by Oct 19, 2019, 2:08 AM

                @FruityBebbles but I don’t understand how this is different than what you had before

                		height: "400px",//default=300px
                		width: "400px",//default=300px
                		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 19, 2019, 2:30 AM Reply Quote 0
                • F Offline
                  FruityBebbles @sdetweil
                  last edited by FruityBebbles Oct 19, 2019, 2:31 AM Oct 19, 2019, 2:30 AM

                  @sdetweil
                  ok, so it turns out that those four are supposed to be outside of the directionsRequest: {} parameters.
                  While I had my config as

                  {
                  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%",
                  			**}**
                  		}
                  	},
                  

                  I had to move those four out, which made my config:

                  {
                  module: "MMM-google-route",
                  position: "top_right",
                  config: {
                  	*height*: "300px",
                  	*width*: "300px",
                          *showAge*: false,
                          *fontSize*: "80%",
                  	key: "api-key", 
                  	**directionsRequest:{**
                  		origin: {"lat": 40.0583287, "lng": -75.0074246}, 
                  		destination: {"lat": 39.9487306, "lng": -75.1965791}, 
                  		avoidTolls: true,
                  			},
                  		}
                  	},
                  

                  the height, width, etc were all in the wrong place-- to me…

                  S 1 Reply Last reply Oct 19, 2019, 2:31 AM Reply Quote 0
                  • S Offline
                    sdetweil @FruityBebbles
                    last edited by Oct 19, 2019, 2:31 AM

                    @FruityBebbles ah, now i have it… yes they have nothing to do with direction to/from

                    Sam

                    How to add modules

                    learning how to use browser developers window for css changes

                    1 Reply Last reply Reply Quote 1
                    • 1
                    • 2
                    • 1 / 2
                    1 / 2
                    • First post
                      10/14
                      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