MMM-GoogleMapsTraffic

Osyris

The traffic layer does update itself just as on the Google Maps website. I don’t know how long the update interval is, but it’s as good as it gets. Google does not provide any APIs for the traffic layer.

sailboarder79

@Osyris okay thanks!

zzaidi148

@vicmora Hi, I’ve been trying for the past week to get your module to work on my magic mirror. The closest I’ve gotten is getting my magic mirror to boot up with the default modules with no google maps traffic module showing. I used npm start dev to see the console it and it looked perfectly fine, saying that it had launched. I’ve tried placing the module in different places in the config. Below is my config, I’ve put it both at the beginning and end of this config. Please let me know which place to put it and how to fix the issue. Thanks!

/* Magic Mirror Config Sample
 *
 * By Michael Teeuw http://michaelteeuw.nl
 * MIT Licensed.
 *
 * For more information how you can configurate this file
 * See https://github.com/MichMich/MagicMirror#configuration
 *
 */
var config = {

	address: "localhost", // Address to listen on, can be:
	                      // - "localhost", "127.0.0.1", "::1" to listen on loopback interface
	                      // - another specific IPv4/6 to listen on a specific interface
	                      // - "", "0.0.0.0", "::" to listen on any interface
	                      // Default, when address config is left out, is "localhost"
	port: 8080,
	ipWhitelist: ["127.0.0.1", "::ffff:127.0.0.1", "::1"], // Set [] to allow all IP addresses
	                                                       // or add a specific IPv4 of 192.168.1.5 :
	                                                       // ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.1.5"],
	                                                       // or IPv4 range of 192.168.3.0 --> 192.168.3.15 use CIDR format :
	                                                       // ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.3.0/28"],

	language: "en",
	timeFormat: 12,
	units: "imperial",

	modules: [
		{
            		module: 'MMM-GoogleMapsTraffic',
            		config: {
                	key: 'i have this',
                	lat: 37.8262306,
                	lng: -122.2920096,
                	height: '300px',
                	width: '300px'
            			}
        		}
    			]
		},
		{
			module: "alert",
		},

		{
			module: "updatenotification",
			position: "top_bar",
		},

		{
			module: "clock",
			position: "top_left",
		},

		{
			module: "calendar",
			header: "US Holidays",
			position: "top_left",
			config: {
				calendars: [
					{
					symbol: "calendar-check-o",
					url: "webcal://www.calendarlabs.com/templates/ical/US-Holidays.ics",
					}
				]
			}
		},
		
		{
			module: "compliments",
			position: "lower_third",
		},
		
		{
			module: "currentweather",
			position: "top_right",
			config: {
				location: "Dallas",
				locationID: "4684888",  //ID from http://www.openweathermap.org/help/city_list.txt
				appid: "private",
			}
		},
		
		{
			module: "weatherforecast",
			position: "top_right",
			header: "Weather Forecast",
			config: {
				location: "Dallas",
				locationID: "4684888",  //ID from http://www.openweathermap.org/help/city_list.txt
				appid: "private",
			}
		},
		{
			module: "newsfeed",
			position: "bottom_bar",
			config: {
				feeds: [
					{
						title: "New York Times",
						url: "http://www.nytimes.com/services/xml/rss/nyt/HomePage.xml"
					}
				],
				showSourceTitle: true,
				showPublishDate: true
			}
		},
		{
            	        module: 'MMM-GoogleMapsTraffic',
            		config: {
                	   key: 'I have this',
                	   lat: 37.8262306,
                	   lng: -122.2920096,
                	   height: '300px',
                	   width: '300px',
            	        }
        	},
	]
		};

/*************** DO NOT EDIT THE LINE BELOW ***************/
if (typeof module !== "undefined") {module.exports = config;}

A Former User

@zzaidi148
I’ve found what is wrong.
you should set position of this module.

module: 'MMM-GoogleMapsTraffic',
position: 'top_left', //this is missed.
config: {
      	   key: 'I have this',

manual of @vicmora has missed this.

zzaidi148

@Sean Thank you so much! Finally, after toiling away at it, with your help, I got it to work. Next up, your calendar module!

blue2monster

@vicmora : I’ve been trying all night long: just cant get the map to be shown.
I can see that the module is started in the dev logs.

Funny thing: If I add some different HTML Output in the module.js It is printed on my screen, the only thing missing is the map.
Same thing is happening on MMM-fuel and MMM-googlemap. Modules are working but the map itself is not shown.
Different one for iFrame: This one is working.

Interesting fact: If I check on the google dashboard for the traffic of this specific api key, I do not see any traffic. Is there anything special in the google api that I need to enable, or any additional module that needs to be installed.

Any ideas: Thanks a lot for the help.

blue2monster

@blue2monster: found now a workaround with the iframe module: This one works… but I haven’t made to switch the traffic layer on

vicmora

@blue2monster Have you tried adding position: ‘top_left’ to your config? I missed this in the docs but will update them.

blue2monster

@vicmora : yes, I added position to various spots(e.g top_left; bottom_center,…) and tried various width and heights but still frame not visible.
Tried as well a complete empty config with only this module loaded-> no sucess.
I guess it might be an Google api key issue: Could you please show you google api devboard: Which service needs to be activated in google api? An which is showing traffic on your google api?
Thanks.

vicmora

@blue2monster This is where I grabbed the api key: https://developers.google.com/maps/documentation/javascript/